Increase size of Checkbox


#1

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.


#2

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.


#3

Also, I’m not sure if this is still relevant, but take a look:

https://community.unbounce.com/unbounce/topics/how_can_i_increase_the_size_of_checkboxes_using_css


#4

Have you found anything that works?


#5

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 :slight_smile:


#6

Thank you. The CSS code worked perfectly!