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 do I change size of the question labels?

    Asked by annhall on February 03, 2016 at 02:55 PM

    How can I fix my question fields so they don't wrap and go further across page?

     

    http://form.jotform.us/form/42645436370152

     

    Page URL:
    http://form.jotform.us/form/42645436370152

    Screenshot
    size field size label size custom css label width
  • Profile Image
    JotForm Support

    Answered by Kevin_G on February 03, 2016 at 06:21 PM

    Just click on the form, then on the top toolbar you will see the option to change the width of your field.

    Other way to achieve it is opening the Designer, you will find it on the top toolbar.

    Then, click on the field and change the width as shown on the image below:

    Hope this helps.

  • Profile Image

    Answered by annhall on February 03, 2016 at 06:47 PM

    Thank you, but I am referring to the question portion (on the left below), not the field where the answer goes.

     

  • Profile Image
    JotForm Support

    Answered by Kevin_G on February 03, 2016 at 07:53 PM

    Inject this CSS code, it will add an space between the labels and the fields:

    .form-label-left {

        padding-right: 20px;

    }

  • Profile Image

    Answered by annhall on February 03, 2016 at 08:35 PM

    I put in the code you sent, but it didn't move much, if at all. How do I make something like this question be on one line, instead of 3?

  • Profile Image
    JotForm Support

    Answered by Kevin_G on February 03, 2016 at 10:11 PM

    .form-label-left {

        padding-right: 40px;

    }

    You can test using this code instead, remove the one provided above and paste this, if it does not separate the fields and labels the sufficient space, then you can increase  the highlighted value.

    Now, in regards to display the text only in one line, I see that you have already added custom CSS codes on your form, this is the one that is displayed the labels as they are currently:

    .form-label-left {

        width: 150px !important;

    }

    You should remove it and the labels will be displayed in a single line.

  • Profile Image

    Answered by annhall on February 03, 2016 at 11:09 PM

    sorry i don't see where that label css code is please advise

  • Profile Image

    Answered by annhall on February 04, 2016 at 12:12 AM

    please advise where it is, and how to remove it, thank you.

  • Profile Image
    JotForm Support

    Answered by Jan on February 04, 2016 at 05:57 AM

    Here's a guide on on how to delete or edit that CSS.

    1. Click the "Preferences" button in the top toolbar.

    2. Go to "Form Styles" tab.

    3. Double click on the "Inject Custom CSS" value in order to edit it.

    Let us know if you need further help. Thank you.

  • Profile Image

    Answered by annhall on February 04, 2016 at 11:40 AM

    Im referring to the previous comment:

    Now, in regards to display the text only in one line, I see that you have already added custom CSS codes on your form, this is the one that is displayed the labels as they are currently:

    .form-label-left {

        width: 150px !important;

    }

     

    where do i find this code and how do i delete? (i don't remember putting this code in and don't see the label width in the css code.

  • Profile Image
    JotForm Support

    Answered by Mike on February 04, 2016 at 01:16 PM

    You may consider changing a 'Label Alignment' from 'Left' to 'Top' in order to have them in single lines.

    Alternately, you will need to adjust a 'Label Width' parameter in order to increase the width for the left aligned labels.

    Thank you.