-
2paulhodgeAsked on March 18, 2025 at 12:23 PM
Hi, please share how we can make this form mobile responsive. Currently, it doesn't show the text and cuts off the text on phones. It is for both Radio Buttons and Button Checkboxes.
Thanks
-
Reban JotForm SupportReplied on March 18, 2025 at 2:28 PM
Hi 2paulhodge,
Thanks for reaching out to Jotform Support. It is easy to make your Button Radios and Button Checkboxes widgets responsive on a mobile screen. You can achieve this by injecting custom CSS into the widget. Let me show you how:
1. First, copy this code:
@media only screen and (max-width: 480px) {
label {
margin-left: -220px !important;
font-size: 13px ! important;
}
}
2. In your Form Builder, click the Paint Roller icon located at the upper-right corner of your page.
3. In the Widget Settings, go to the Custom CSS tab and paste the code in the last row of the code area.
4. Click on Update and repeat the same steps for your other widgets.
That's it. Test your form, and you'll see that the Button Radios and Button Checkboxes widgets are now responsive on mobile screens. Check out the screencast below for the result:
Give it a try and let us know how it goes.
-
2paulhodgeReplied on March 18, 2025 at 3:49 PM
Thanks but this doesn't seem to work. I've applied multiple codes already before reaching out.
Can you please apply the code first on our form to see the difference for both radio buttons and button checkboxes. Your help is really appreciated!
-
2paulhodgeReplied on March 18, 2025 at 3:52 PM
Please discard above. I see the issue now and it's working fine.
Thank you for your support.