Различные флажки в Chrome

У меня такая же версия Chrome 31 открыта для двух сайтов, и у одного сайта есть флажок справа, и я проверил стили в отладчике, но я не могу понять, что вызывает его.

enter image description hereenter image description here

это должен быть особый стиль Chrome, поскольку он просто использует стандартный <input type="checkbox" />

это флажок с большими css width и height:

enter image description here

Оба сайта используют <input type="checkbox">

Ответы

Ответ 1

Я понял это. Другой сайт был слегка увеличен в Chrome. Стиль CSS для перевода на альтернативный рендеринг - это... масштабирование.

zoom: 1.1

Ответ 2

Я сделал версию, которая не требует использования тега <label>:

http://jsfiddle.net/4bs8A/

1 фрагмент css меняет все флажки с небольшим количеством хлопот, была цель, для которой я собирался.

Не тратьте время на стиль, но вы получаете суть.

Ответ 3

Кажется, что последний хром и IE, im контрастируют с Firefox, способны масштабировать флажки и переключатели до требуемой ширины и высоты.

Следующий код масштабирует радиостанции и флажки размером 50 пикселей x 50 пикселей.

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

Пожалуйста, сравните внешний вид в разных браузерах: https://jsfiddle.net/t9q0mny2/

Ответ 4

Первый флажок установлен по умолчанию, второй флажок - обычай. Стандартный флажок, нарисованный каждым браузером по-своему. Пользовательский флажок меняет свой внешний вид с помощью JS + CSS для IE8 и рано или только с CSS с использованием :before и :after.  DEMO с четким CSS