JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.
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.
I need some help splitting my form into 2 columnsAsked by tidybooks on December 11, 2015 at 06:02 AM
Hi I have a form built but I would like to split this into 2 columns I have tried the Shrink option but this doesn't create the desired results. So looks like a CSS job. I have attached an image to show how I would like it to look. Unfortunately my css skills are very basic so not sure where to begin. Any help would be great!
shrink create thanks attached
I cloned your form for testing purposes, you can check it here: https://form.jotform.com/53443739344965?.
To do this, here's how I did it:
1. First, place the form fields you want to be on the same row side by side, example:
"Full Name" "Phone Number"
"Last Name" "E-mail"
I shrink them and merge them on the same line. Here's a guide: http://www.jotform.com/help/328-How-to-Position-Fields-in-JotForm
2. After that, tick "Enable Form Columns" in your Form Designer Tool. Also adjust the form's width, in my case, its set to "900".
3. If the "Serial Number" field is quite off on the right, you'll need to use this custom CSS code:
padding-left: 18px !important;
If you want to copy or clone my form, you can do that by following this guide: http://www.jotform.com/help/42-How-to-Clone-an-Existing-Form-from-a-URL
Let us know if that works.
Thank you I will try this out!
Hi thanks again for the answer
My next questions is I have make form responsive ticked but in mobile mode this form doesn't work correctly. How can I get this to work correctly. thanks
I could replicate the same situation. I will add some changes to the responsive css code to solve this situation.
I will let you know as soon as I have more details.
That is great thank you Carina
Brilliant thank you for that!
You are welcome. Glad to see that solution provided by our colleague worked for you. If you need any further assistance, please do not hesitate to get back to us. We will be happy to help.
Thank you for using JotForm!!