Dropdown menu to be aligned in horizontal not vertical

  • Profile Image
    b.m.ezzat
    Asked on January 31, 2016 at 01:57 AM

    Dears

    Am having three drop down menu which are lined vertically in 3 lines, i want them to be in one horizontal line next to each other

    Please support 

    Attached snapshot of the three options lined vertically

  • Profile Image
    Welvin
    Answered on January 31, 2016 at 12:35 PM

    You have to consider changing the width of the dropdowns. After that, shrink the fields. Please check the following guide for more on field positioning:

    https://www.jotform.com/help/90-Form-Field-Positioning

     

    If that doesn't help, access the form designer and enable the columns there:

  • Profile Image
    b.m.ezzat
    Answered on February 01, 2016 at 04:24 AM

    i did as you mentioned but i was able to put only 2 dropdown menu in same line, however i want to put the three in one line can you support in this

     

    Also i dont want to change the size of any other drop down menu in the form

  • Profile Image
    EltonCris
    Answered on February 01, 2016 at 08:52 AM

    If you don't want to resize the dropdown fields, you might want to consider reducing the left and right spacing between them.

    Inject this CSS codes to your form, this should align the 3 column fields into a single row.

    .form-col-1 {

        padding-right: 5px;

    }

    .form-col-2,

    .form-col-3 {

        padding-right: 5px;

        padding-left: 5px;

    }

    Guide: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes (paste it at the bottom part).

    Result:

    Let us know if you need further help.