Собственно, речь о стилизации радиобаттонов и чекбоксов. Радиобаттон должен быть круглым, но в IE8 border-radius не работает.
Вариант включать обводку в фоновую картинку не подходит, поскольку нужны обводки разных цветов в зависимости от условий.
Какие есть альтернативы?
input[type="radio"], input[type="checkbox"] {
display: none;
}
input[type="radio"] + label, input[type="checkbox"] + label {
border: 1px solid green;
display: inline-block;
cursor: pointer;
width: 1em;
height: 1em;
}
input[type="radio"] + label {
border-radius: 50%;
}
input[type="checkbox"] + label {
border-radius: .25em;
}
input:checked + label {
background: silver; /* На самом деле тут фоновая картинка, разная */
}
PS: Вместо :checked скрипт вешает соответствующий класс.
Ответ
Дикая, конечно, идея: в IE8 прекрасно работает vml. Можно внутрь label поместить vml:shape и стилизовать уже его.
Комментариев нет:
Отправить комментарий