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 can I place 2 number fields on a single line?

    Asked by guysyml on January 12, 2015 at 07:00 PM

    I am seeking to ask our users how long they have been at an address.  I am wanting to ask them this with 2 fields (Years & Months). 

    From a visual perspective though, I am not wanting to ask 2 questions, but rather 1.  "How long have you lived at this address?"  Optimally, below this question there would be 2 fields in a single row with suggestion text of "Years" in one field and "Months" in another field.

    I am wanting to do this with separate fields (not configurable list with 1 row) because I will then be creating calculations on the input values in the fields and I understand that with a configurable list widget, it is not feasible to access the individual fields of a configurable list for calculation purposes.

    I have tried to shrink the Months field according to this link: http://www.jotform.com/help/90-Form-Field-Positioning

    However, it does not "join" the "Years field" which is presently above it.

    How should I go about aligning these two fields on one line / question?



  • Profile Image
    JotForm Support

    Answered by jonathan on January 12, 2015 at 08:06 PM

    Hi Guy,

    Please try it like this

    1. Make sure the 'Year' field is in 'Shrink' mode

    2. Select 'Month' field and on its property select the option 'Merge to above line'




    if done correctly, it should work like this


    Then you can just use the Form Designer to use custom CSS to bring the 2 fields closer



    Here is my test jotform http://form.jotformpro.com/form/50118007148951?


    Hope this help. Let us know if you need further assistance.



  • Profile Image

    Answered by guysyml on January 14, 2015 at 12:08 AM

    Thank you very much for the direction.  Can you point me in the direction of a video or text tutorial on the use of the Designer? (Both overall usage and more specifically, the CSS editor? )

  • Profile Image
    JotForm Support

    Answered by ashwin_d on January 14, 2015 at 08:19 AM

    Hello guysyml,

    You may like to take a look at the following guide where we have several video tutorials available explaining "Form Designer" :  http://www.jotform.com/help/300-Form-Designer-Tutorial-Let-s-create-fantastic-forms- 

    Hope this helps.

    Do get back to us if you have any specific questions and we will surely help you.

    Thank you!