What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    How to format the scale function so that it will fill up the entire width of the form?

    Asked by zubeida on August 05, 2015 at 09:23 AM

    Hi

    I would like to know if there's a way to format the scale function (section G, q20-23) so that it will fill up the entire width of the form instead of appearing to be aligned to the left as it looks kinda untidy right now.

    I'm thinking of making the question on top to fill up the width of the form (either by increasing the font or someway else) and place the selection/scale/answer aligned to the middle.

    OR

    Increasing the font for both question and answer so that it will fill up the form.

    I'm open to other suggestions too, If you guys have a better idea please help me with this too, Thanks!

    Page URL:
    http://form.jotform.co/form/51928449774875?

    Screenshot
    format fill scale Entire
  • Profile Image
    JotForm Support

    Answered by david on August 05, 2015 at 12:25 PM

    Hi,

    You can adjust the spacing of the button for those fields by adding this code:

    http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    #input_88_1, #input_88_2, #input_88_3, #input_88_4, #input_88_5, #input_88_6, #input_88_7 {
        width : 50px;
    }

    #input_89_1, #input_89_2, #input_89_3, #input_89_4, #input_89_5, #input_89_6, #input_89_7 {
        width : 50px;
    }

    #input_90_1, #input_90_2, #input_90_3, #input_90_4, #input_90_5, #input_90_6, #input_90_7 {
        width : 50px;
    }

    #input_91_1, #input_91_2, #input_91_3, #input_91_4, #input_91_5, #input_91_6, #input_91_7 {
        width : 50px;
    }

    You can adjust the width values until there is proper total width for each field.

    If you have any further questions, let us know and we will be happy to help.

  • Profile Image

    Answered by zubeida on August 07, 2015 at 08:35 PM

    Hi David, thanks for the help!

     

    I've tried out the adjustments, however I can't seem to be able to aligned the scales so that the 'circle' will all be aligned at the center (with the same size). Currently it does look a little untidy due to the different alignments. Is there a way to force the circle for it to be in the center so that it will look tdier?

  • Profile Image

    Answered by Ben on August 08, 2015 at 03:42 AM

    Can you please open the form directly and see if you are seeing the same issue there?

    When I took a look at it, it seemed rather aligned and in nice circles:

    I ask to check it out directly: http://form.jotform.co/form/51928449774875?jumpToPage=8 since that is how your users/clients will see it, and the form builder can have few other styles added to it due to having its own styles to allow easier editing.

    If you have the same issue please do include the screenshot and let us know what is the browser that you have the issue with so that we can check in the same.

  • Profile Image

    Answered by zubeida on August 08, 2015 at 08:07 AM

    Hi Ben, 

    thank you for your reply. 

    Yes, I am seeing what you have just screenshot. However, I am wondering if it is possible to have the scales directly under each other for all questions. For now, the scales are aligned to the middle for each question, however from question 20 to 21, it can be seen that the scale for question 21 starts at the further left instead of having the same alignment as question 20.

    Do forgive me if my words don't make any sense, do let me know if you need any more clarification.

    Thanks!

  • Profile Image
    JotForm Support

    Answered by Welvin on August 08, 2015 at 02:21 PM

    I think changing the padding will work. I did it to the cloned version of your form. Here's the link:

    http://www.jotformpro.com/form/52194979716976?jumpToPage=8

    If you want the same style, you have to inject the following custom CSS codes:

    .form-scale-table th, .form-scale-table td {

        padding: 9px 20px !important;

    }

    You can adjust the right and left padding if you need to.

    Thanks