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

    Can I adjust the space between the first name and last name fields?

    Asked by snaplash on September 21, 2014 at 12:46 PM

    I would like to apply a uniform spacing between fields on the same line.

     

    is this possible?

    Page URL:
    http://www.snaplashwebsite.com/section3

    name first name and JotForm uploads png same line
  • Profile Image

    Answered by Ben on September 21, 2014 at 02:56 PM

    Hi,

    I see what you mean. The issue here is that you have one minus character between the second set of fields

    [field2] - [field2]

    For that reason the fields seem more separated than the other two above them.

    What we can do to rectify this is to add this CSS code to your jotform:

    .form-section .form-line:nth-child(1) .form-input .form-sub-label-container:nth-Child(2) input {
        margin-left: 10px;
    }

    You can see how to add it here: Inject Custom CSS Codes

    Do let me know if this is what you wanted to achieve.

    Best Regards,
    Ben

  • Profile Image

    Answered by snaplash on September 21, 2014 at 03:48 PM

    Thank you for looking at my issue. Its really appreciated.

     

    I injected the css but nothing is changing unfortunately, am i doing something wrong?

     

    am i to change the "nth"?

  • Profile Image

    Answered by Ben on September 21, 2014 at 05:24 PM

    Hi,

    The CSS should work as it is - as they say out of the box.

    I took a look at your pages and it seems to be working when I visit it:

    The nth-child() tells the CSS which child we want. Since there are several different elements with same classes, using this parameter we make sure that the right ones are used and the other ones are not.

    I would suggest trying to do hard refresh (CTRL+F5) when you view the page on your site. This should load all of the styles and javascripts (all resources) once again, so if your browser is caching them, they will get called once again.

    This should then start showing you the same that we see.

    If it does not, do let me know.

    Best Regards,
    Ben