- art_crateAsked on June 02, 2016 at 05:54 PM
Hello, On my second survey question I have 8 options, they are displaying in 3 columns. I would like them to display in 4 columns (2 rows).Page URL:
- JotForm SupportjonathanAnswered on June 02, 2016 at 09:21 PM
I assume you meant this image checkboxes on your form https://www.jotform.com/answers/852583
I will check what CSS code is needed to have them in 4 column spread. I'll get back to this shortly.
- JotForm SupportjonathanAnswered on June 02, 2016 at 09:24 PM
Please add this CSS codes on your existing CSS codes
width : 950px !important;
You can check it working on my test form https://www.jotform.com/61538375481967
Let us know how it goes.
- art_crateAnswered on June 03, 2016 at 12:42 AM
Thank you for the update! The columns look great, they are not centered. Can they be centered on the page.
- CharlieAnswered on June 03, 2016 at 12:57 AM
From the looks of it, it seems like you have already changed width to give you a 3 column display. The images are also now centered when I view it.
You might also need to check your custom CSS code for errors, I see one when I cloned your form. You're missing a closing bracket "}" in one of your code blocks.
If you are still having problems on this, please do let us know.
- CharlieAnswered on June 03, 2016 at 01:04 AM
I stand corrected, it seems like you wanted the 2nd page, the 8 item check box to be in 4 columns with 2 rows. If that's the specific layout you want, you can paste this custom CSS code:
width: 100% !important;
max-width: 1000px !important;
It should automatically have it centered. Here's how it looks like:
Note that if the screen size is small, the check box display will adjust accordingly.
Let us know if that works.
- art_crateAnswered on June 03, 2016 at 01:35 AM
It looks like it is now centered (question 2), however it is still displaying 3 columns, instead of 4. I added the css that Jonathan supplied and it is still not working, please let me know how to proceed.
width : 950px !important;
- JotForm SupportChriistianAnswered on June 03, 2016 at 01:50 AM
There appears to be an error in the css, which is why the custom css is not being updated correctly. To resolve the issue, please visit your Form Designer and add a closing bracket ( } ) as seen below.
Once the bracket has been added, the custom css should now work correctly.
- art_crateAnswered on June 03, 2016 at 02:53 AM
I closed the bracket, but I am still not getting the result I want. See images below. I would like 4 columns and two rows center.
- JotForm UI DeveloperberilAnswered on June 03, 2016 at 05:09 AM
I've cloned and tested you form. I am not able to reproduce the same issue that you’re having.
Could you try to clear your form caches? After that, we would appreciate it if you could also test it on your side and let us know the result.
- art_crateAnswered on June 04, 2016 at 03:29 AM
that did the trick!