-
LMBE90Asked on August 20, 2016 at 4:41 PM
Hi there
even after reading through several threads in the forum, I couldn't find an answer to my problem I am having with a radio button element in my form.
For design reasons, I did put them horizontal by making 4 columns. This looks great on a desktop, but needs to be adjusted on mobile phones to a vertical order to avoid the mess/collision you can see in the screen shot attached.
All other elements are responsive, it's just this part that doesnt work on mobiles. Is there a CSS injection to solve my problem?
Thanks for the help :)
Gabriel
-
Welvin Support Team LeadReplied on August 20, 2016 at 7:16 PM
You can inject the following custom CSS codes to your form to list the items down:
@media only screen and (max-device-width: 768px) {
.form-multiple-column[data-columncount="4"] .form-radio-item, .form-multiple-column[data-columncount="4"] .form-checkbox-item {
width: 100% !important;
}
}
Please follow the steps from this guide to inject: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes. Add the custom CSS codes to the bottom if you have an existing CSS in the area.
-
LMBE90Replied on August 20, 2016 at 7:52 PM
Dear Welvin
I am really glad for the help. I did inject your CSS codes and it works!
thank you so much!
Gabriel