Как мне поменять стиль радиокнопок, что бы они выглядели как чебоксы? Нужна кроссбраузерность. Нашла в интернете такой код:
input[type="radio"]{
-webkit-appearance:checkbox; /*chrome,safari,opera*/
-moz-appearance:checkbox; /*firebox*/
-ms-appearance:checkbox; /*not currently supported*/
}
Но не работает в IE и опере.
На основании нишеизложенного
(document).ready(function() {
$("input[type=radio]:checked").parent("label").css(" background-position","0 -21px");
});
div.boolean br{display:none;}
div.boolean>label {
display: inline-block;
text-align: left;
padding: 0;
margin: 0 10px 0 0;
}
input[type="radio"] {
visibility: hidden;
}
label:before{
display: inline-block;
content: "";
width: 20px;
height: 20px;
border: 1px solid grey;
margin-right: 10px;
cursor: pointer;
border-radius: 4px;
background: url('http://www.dis-ag.com/SiteCollectionDocuments/images/checkbox-sprite.png');
background-size: 100%;
}
<div class="fields boolean">
<label><input type="radio" value="1" name="UF_PRICE_LIST">да</label><br>
<label><input type="radio" value="0" name="UF_PRICE_LIST" checked="">нет</label>
</div>