-
mdscj1Asked on September 25, 2016 at 11:47 PM
Here's my jotform: https://form.jotform.com/62318439859166
My last field, "Accepting the terms...", as 2 checkboxes but the texts for those 2 options needs to be spread out all the way to the right in the blue form box. How do I do that?
-
beril JotForm UI DeveloperReplied on September 26, 2016 at 3:11 AM
To solve that issue could you please inject the CSS code below:
.form-checkbox-item label {
width : 500px !important;
}
If this does not resolve the issue, please let us know and we will be glad to take another look.
-
mdscj1Replied on September 26, 2016 at 12:08 PM
Where do i put this code?
-
mdscj1Replied on September 26, 2016 at 12:18 PM
Also, how do I make these 5 set of words in the options to be clickable to a link:
User Terms and Conditions
User Privacy Policy
Affiliate AgreementAffiliate Policies and Procedures
Affiliate Privacy Policy.
-
CharlieReplied on September 26, 2016 at 1:44 PM
You can use this CSS code instead:
#cid_19, #cid_19 > div, #cid_19 > div > span, #cid_19 > div > span > label {
width: 100% !important;
min-width: 100% !important;
}
Paste it under the CSS tab in your Form Designer Tool.
For the follow up concern you have, you need to wrap the said text using the <a> to anchor a link. Here's a link to learn more about it: http://www.w3schools.com/tags/tag_a.asp
In your case, you can do that directly in the "Options" list. Below is a screenshot of an example, in my case, in the "Options" list, this is how it is written:
<a href="http://www.website.com" target="_blank">User Terms & Conditions</a>
I hope that helps.
-
mdscj1Replied on September 27, 2016 at 12:50 AM
Yes, that helps. Next thing, how do I make the text of the clickable link more visible? Perhaps bold and red. I need to try this and see if it's more visible. If not, please also show me how to change the color. Thank you.
-
Chriistian Jotform SupportReplied on September 27, 2016 at 3:37 AM
To change the link's color to red and make it bold, simply inject the custom CSS code below to your form. You can change the color to something else by replacing the highlighted text.
a {
color: red;
font-weight: bold;
}
Here's how it should look after:
Regards.