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

    Is it possible to change the 'label width' individually rather than globally?

    Asked by simonglenister on October 25, 2011 at 06:03 PM
  • Profile Image

    Answered by paoloumali on October 25, 2011 at 06:35 PM

    Yes, you can easily do so. For most form elements, please do the following.

    1. Highlight the form element.

    2. Click 'Form Style' tab at the top

    3. There should be a 'Label Width' property that you can change in the toolbar.

    Please let me know if you need further help.

  • Profile Image

    Answered by simonglenister on October 25, 2011 at 07:11 PM

    The only problem is that this changes all the label widths for the entire form. What I'd like to be able to do is to just change one only?

  • Profile Image

    Answered by paoloumali on October 25, 2011 at 07:22 PM

    I'm sorry. You may change the label's width for a particular form element by utilizing the 'Inject CSS' feauture.

    Here is the guide for that.

     

    You can specify specific properties by using a unique reference to an element.

    Below is an example.

    ---

         <li class="form-line" id="id_16">

            <label class="form-label-left" id="label_16" for="input_16"> Your E-mail Address </label>

            <div id="cid_16" class="form-input">

              <input type="email" class="form-textbox validate[Email]" id="input_16" name="q16_yourEmail16" size="20" />

            </div>

          </li>

    ---

    For the above, the element label has an id of label_16.

    A style can be added for that like below:

    ---

    #label_16 {

    width:200px !important;

    }

    ---

    Simply add the previous code as shown in the 'Inject CSS' guide.

    Please let us know if you need further help.

  • Profile Image

    Answered by paoloumali on October 25, 2011 at 07:48 PM

    I hope this screencast will make it clearer.