Is it possible to increase the size of the checkbox and the checkbox choice font with CSS? I am using flexible form fields and the checkboxes/values are really small.
I was curious about this too. I’m pretty sure it’s a custom code thing. I have some coders that I use if you need references.
Also, I’m not sure if this is still relevant, but take a look:
Have you found anything that works?
Userlevel 6
This is possible using some CSS. The ‘2’ in the code below represents the size of the checkbox.
input[type=checkbox] {
transform: scale(2) !important;
}
It’s not the prettiest solution the bigger you go as it’s scaling up what’s already on the page. You’ll also need to adjust the spacing between the checkboxes and labels to account for the bigger size. So you’ll need one more CSS rule to make that happen:
div.lp-pom-root .lp-pom-form-field .option {
margin-bottom: 20px !important;
}
You’ll need to play around with it to get the sizing and spacing to your liking. But this will work in increasing the size of the boxes 🙂
Thank you. The CSS code worked perfectly!
Hi this isn;t working for me, what could i be doing wrong?
Pasted it into style sheet
Userlevel 6
Hi @jcasson It’s hard to say without having a look at the page. Off the top of my head though, did you wrap the above code in tags when adding it to the stylesheet tab?
Thanks Rob…after 4 hours I was able to figure out how to wrap the code in a style tag for sizing the button (i used radio)… for the life of me I can not get the spacing down…what do I wrap that in? can you please type out exactly what I’ll have to do for the radio button forms? Thanks So much.
That’s AMAZING ROB!.. for anyone, if you change “checkbox” to “radio” you can change “radio buttons” size… GOOD!
Reply
Log in to the Unbounce Community
No account yet? Create an account
Enter your username or e-mail address. We'll send you an e-mail with instructions to reset your password.