How can I make a 4-column form?

  • Profile Image
    intersportgroup
    Asked on February 24, 2017 at 02:35 PM

    No matter what I do I cannot get my test form to format within the 4 columns I have created.  When I try to drag them into place the whole screen just shutters around and nothing gets moved.

    Also when I use the previous function the radio dots are not aligned, the letters become scrunched and not aligned. 

    Is there any way to have real time assistance so I can make a decision about switching to JotForm?

     

    Dona

  • Profile Image
    Jim_R
    Answered on February 24, 2017 at 04:03 PM

    Hello Dona, we don't offer phone support. However, we'd be more than willing and happy to help you here in a timely manner. 

    You have to do a couple of things to make this work as a 4-column form:

    1. Ensure you are indeed using 4 columns. When I cloned your form, I'm seeing it's set to 3 columns only.

    2. The 4th field named Front Width (A) should be Moved to a new line.

    3. Then use CSS to reduce the width of the 2-column field named Base Size so it won't look odd with the other 1-column Radio Buttons. We'll also set the total width of the form so it can accommodate 4 columns.

       3a. REMOVE the CSS you have placed on your form

       3b. REPLACE them with these:

    .form-multiple-column .form-radio-item {

        width : 70px;

    }

    .form-all {

        width : 960px !important;

    }

    This short clip will show all the steps above:

    And here's my cloned form https://www.jotform.com/70545750839969

    Feel free to clone it too (here's how) in case you wanted to start from there.