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

    Text Label on Same Line as Text Box

    Asked by dlasson on March 08, 2016 at 06:18 PM

    Please see the first two lines in my form. I would like the text box for "Position Applied For" to be side by side with its text label as it is for "Applicant Name." "Label Align Left" does not keep all three words of the text label on one line.

    Thanks.

    Page URL:
    https://form.jotform.com/53006010463136

    label text label same line same
  • Profile Image
    JotForm Support

    Answered by Charlie on March 09, 2016 at 02:13 AM

    This is because the width of the label for the field "Position Applied For" it too small.

    I have two solutions that you can try, both using custom CSS code.

    Solution 1:

    You can use this CSS code to simple adjust all the width of your labels, this will make your layout much more cleaner if all labels have the same width:

    .form-label.form-label-left {

        width : 35% !important;

    }

     

    Solution 2:

    If you just want to specifically adjust the label width for "Position Applied For", then you can use this one instead:

    #label_42 {

        width : 35% !important;

    }

     

    Just to add, make sure to set the "Applicant Name" to label align left. When I cloned it, it was set to right. Here's how it looks like when I used solution #1: https://form.jotform.com/60681022806955 

    You can adjust the width value depending on your own preferences. Paste your chosen CSS code under your "CSS" tab in your Form Designer Tool.

     

    Let us know if you need more information on this.