Avatar for Username

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

This thread was archived. Jei jums reikia pagalbos, užduokite naują klausimą.

Firefox does not render CSS-styled checkboxes the correct width/height.

  • 1 reply
  • 38 have this problem
  • 6 views
  • Paskiausią atsakymą parašė cor-el

rainman797
rainman797
more options

I'm trying to create a page that renders the checkboxes slightly larger than the browser default. It's important because I'm creating a quiz for young kids (5-7 years old), and ensuring a large click area and that they know where to click can have an effect on their score.

I've poked about on the web and found the http://www.456bereastreet.com/lab/styling-form-controls-revisited/checkbox/ site that shows how different browsers render CSS styles for checkboxes. Firefox seems to ignore CSS related to this completely. Is this a bug, an oversight, or a deliberate decision? If the latter, I'm curious as to why.

Thanks for the help!

I'm trying to create a page that renders the checkboxes slightly larger than the browser default. It's important because I'm creating a quiz for young kids (5-7 years old), and ensuring a large click area and that they know where to click can have an effect on their score. I've poked about on the web and found the http://www.456bereastreet.com/lab/styling-form-controls-revisited/checkbox/ site that shows how different browsers render CSS styles for checkboxes. Firefox seems to ignore CSS related to this completely. Is this a bug, an oversight, or a deliberate decision? If the latter, I'm curious as to why. Thanks for the help!

Modified by rainman797

All Replies (1)

cor-el
cor-el
  • Moderator
  • Top 10 Contributor
more options

Try to add -moz-appearance: none; to the style of the checkboxes. 

input[type="checkbox"] {-moz-appearance: none;}