Is it possible to position 2 different fields side by side instead of stacked?

  • pthimsen
    Asked on November 11, 2014 at 1:41 PM

    I would like to position 2 smaller fields side-by-side on my form instead of stacked one on top of the other. Is that possible?

  • abajan Jotform Support
    Replied on November 11, 2014 at 3:22 PM

    Yes, that's certainly doable. Please have a look at our Form Field Positioning guide (specifically the last section: Merging a Form Field to a Line Above) for details. If you need further assistance with this, do let us know.

    Thanks

  • pthimsen
    Replied on November 12, 2014 at 2:11 PM
    Hi – again I am having trouble accessing info referenced using the link provided. Most of the responses from the Forum include a link for instruction that does not work. I am also finding the “search” option in JotForm is not helpful as it rarely takes me to the instruction requested even when I use the “language” provided from JotForm. I either get nothing at all as in “info not found” or a list of instructions that includes everything from JotForm and does not isolate just the topic I am searching.
    Please send me a functional link on the Form Field Positioning as I am not able to locate this info by the link provided or by trying to use the “search” option.
    Thank you –
    ...
  • Jeanette JotForm Support
    Replied on November 12, 2014 at 3:36 PM

    Please check my answer I provided to a similar thread here :

    https://www.jotform.com/answers/457662-How-can-I-get-my-form-options-to-be-side-by-side-on-the-site#1

    I am also copying the Field Positioning entire guide below:

    -----------------------------------------------------------------------------------------------------

    Field positioning is essential in designing your forms to match to your website structure. There are times that you will want to keep two or more fields on the same line (side by side.) Other times, fields will need their own lines. Luckily, JotForm provides different functions to manipulate form field positions.

    First, we must learn how to shrink a field to allow it to be positioned next to another field. 



     

    Shrinking a Form Field: 

Click "Settings" or "Right Click" on a form field and click "Shrink.”


    Is it possible to position 2 different fields side by side instead of stacked? Image 1 Screenshot 70

     

    Shrinking allows a form field to take up only the space it actually needs instead inhabiting a whole line. Look at Example 1 below:

    Example 1:

    Is it possible to position 2 different fields side by side instead of stacked? Image 2 Screenshot 81

     

    Moving a Form Field in a New Line: Click "Properties" or "Right Click " a form field and click "Move to a new line" to get the form field to a new line.

    Is it possible to position 2 different fields side by side instead of stacked? Image 3 Screenshot 92

     

    This moves a shrunken field to a new line and separates it from another shrunken field above it. Look at Example 2 below:

    Example 2:

    Is it possible to position 2 different fields side by side instead of stacked? Image 4 Screenshot 103

     

     

    Merging a Form Field to a Line Above: Click "Properties" or "Right Click" a form field and click "Merge to above line" to move the  field to the line above.

    Is it possible to position 2 different fields side by side instead of stacked? Image 5 Screenshot 114

     

    As the opposite of "Move to a new line,” this is used to keep two or more fields in the same line. Look at Example 3 below:

    Is it possible to position 2 different fields side by side instead of stacked? Image 6 Screenshot 125

     

     

    That's about everything when it comes to positioning your fields for better design. Did you find this article useful? Please comment below if you had any issues applying the positioning techniques.