Different Chrome checkbox styles Different Chrome checkbox styles google-chrome google-chrome

Different Chrome checkbox styles


I figured it out. The other site was zoomed slightly in Chrome. The CSS style to flip to the alternate rendering is...zoom.

zoom: 1.1


I made a version which doesn't require using <label> tag:

http://jsfiddle.net/4bs8A/

1 snippet of css changes all checkboxes with little hassle, was the aim I was going for.

Didn't spend long on the style, but you get the gist.


It seems to be the case that the latest chrome and IE, im contrast to Firefox is able to scale checkboxes and radio buttons to the required width and height.

The following code will scale the radios and checkboxes to 50px x 50px large checkboxes.

input[type=radio], input[type=checkbox] {    height: 50px; width: 50px;}

Please compare the appearance in different browsers:https://jsfiddle.net/t9q0mny2/