如何在Firefox中修复截止复选框元素？

Question

I'm on FF 43.0.3, Mac OS 10.9.3. FF is cutting of the native checkbox on the right. It's not a css problem on my part; I confirmed the cutting off in CodePen. I also viewed a couple of random sites with checkmarks, and I see the same. I made sure to reset my browser zoom to default, and the default font is Times at 16px. I also tried turning off hardware acceleration via Preferences as another site suggested. Didn't work. The only code I have in my CodePen example is <input type="checkbox">

Would love to hear any suggestions.

Answer 1

This happens because of styling issues, and appears differently on different browsers. So try fixing the styling of the checkbox element and it's parent element, add some or all of these styles:

#parent-element { /*Or Whatever The ID Of The Parent Element Is*/
     line-height: 20px;
     height: 20px;
     display: block
}
#checkbox-element { /*Or Whatever The ID Of The Checkbox Element Is*/
     display: block;
     height: 20px
}

Try changing the styles of the elements with different values to suit your needs.