-
rossallAsked on May 20, 2016 at 4:39 AM
I have within layout made 3 columns for my page and I have then increased the radio buttons to 2 columns each but the text for each radio button if large overlaps the other.
Page URL: https://form.jotform.com/61394109959972 -
Chriistian Jotform SupportReplied on May 20, 2016 at 6:06 AM
Hi,
I believe you are referring to these radio buttons.
Please try injecting the CSS below to your form. Please see How to Inject Custom CSS Codes.
.form-radio-item label {
white-space: normal;
margin-left: 30px !important;
text-indent: 0px !important;
}
Doing so will wrap the texts of radio buttons as below.
Do let us know if you need further assistance.
-
rossallReplied on May 20, 2016 at 6:42 AM
Thank you Chriistian. Could you do the CSS for just certain Radio buttons eg just Option Block 3 and Option Block 4. As the others look better in the normal format.
Cheers, Kirstie
-
Nik_CReplied on May 20, 2016 at 8:55 AM
Sure, just replace the CSS for this one below:
#id_16 {
white-space: normal;
text-indent: 5px !important;
}
#id_17 {
white-space: normal;
text-indent: 5px !important;
}
And it should look like this:
Let me know if you have further questions.
-
rossallReplied on May 23, 2016 at 4:35 AM
Hi Jotform Support
Sorry to be awkward but could I have the CSS so that the radio button text wraps in alignment as the first does but only for the ID's 16 and 17
Thank you again
-
Chriistian Jotform SupportReplied on May 23, 2016 at 5:00 AM
Please try this custom CSS code in your form to implement the same style as the first one for ID 16 and 17 only.
#id_17 .form-radio-item label {
white-space: normal;
margin-left: 30px !important;
text-indent: 0px !important;
}#id_16 .form-radio-item label {
white-space: normal;
margin-left: 30px !important;
text-indent: 0px !important;
} -
rossallReplied on May 23, 2016 at 3:27 PM
Thank you so much for all your help. Can always rely on Jotform support for quick answers and great assistance.