Is there a way of placing 2 columns on my form?

  • Profile Image
    jabedoya60
    Asked on July 26, 2017 at 07:03 PM

    Hi, we need help, this form is long and we do not want to separate into different sections, the problem we are having is that there is a lot of wasted space and it makes the form very long, there are plenty of spaces where 2 fields can go side by side, please take a look at the form, is there a way of placing 2 columns? Or anything so the fields are more neatly arranged?

    https://www.jotform.com/build/72057545584160

    Thank you.

  • Profile Image
    Kiran
    Answered on July 27, 2017 at 12:00 AM

    You may position the fields in two columns by following the guide below:

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

    Also, you may enable the Form Columns option in the Advanced form designer after shrinking the fields.

    Please check the guide below for more help.

    https://www.jotform.com/help/423-Setting-up-Form-Columns

    Thanks!

  • Profile Image
    jabedoya60
    Answered on July 27, 2017 at 09:03 PM

    Hi, the form looks better thank you, still I placed 2 columns and they do not lined up at all in some rows, please take a look at my screenshot.

    Also, how can I make the header title and subtitle white?

    Thank you very much.

  • Profile Image
    Kiran
    Answered on July 27, 2017 at 10:57 PM

    Please try moving the first field on the row to the next line to display only two fields in the row. For example, the Birth Date field on the screenshot provided is in the same line of Student's Name and Gender fields. You may move the Birth Date field to the next line from the field properties.

    Also, you may be required to align the field label to Top to display them correctly when they are shrunk if they are displaying to the left.

    Also, how can I make the header title and subtitle white?

    You may inject the following CSS code the form to display the header in white color.

    .form-header-group .form-header, .form-subHeader  {

        color: #ffffff;

    }

    Hope this information helps!