Radio button text not responsive

Hi, I realised that the text on my radio buttons are not responsive when I embed the form on wordpress. It doesn't wrap and thus can't be fully read by user on mobile. I have made the form responsive. Please help.

You can make your radio button text to be responsive with Injecting Custom CSS. Just place following CSS in to your form. Inside of JotForm Builder go to Setup and Embed, choose Preferences, Form Style, Inject Custom CSS and at the end of existing code paste this code:

.form-radio-item label, .form-checkbox-item label {

display: block !important;

margin-left: 19px;

margin-top: -17px;

}

@media only screen and (max-width: 550px){

.form-all {

width:100% !important

}

.form-radio-item label {

white-space:normal;

}

.form-checkbox-item label {

white-space:normal;

}

}

After adding this code radio button text should look like this on mobile device.

Hope this will help.

Thanks. However the alignment is abit disjointed. Able to help please?

Hello amkmc,

Have you tried adding "Mobile Responsive" widget in your form already?

I would suggest you to remove the custom css code you have added in your form for radio button and just add the "Mobile Responsive" widget. That should most likely solve your problem. 

Please be noted that for your form to work on mobile devices, we suggest you to embed your form using its iFrame embed code. The following guide should help you:  http://www.jotform.com/help/148-Getting-the-Form-iFrame-Code 

Hope this helps.

Do get back to us if you have any questions.

Thank you!