0
107
ViewsGet default checkbox/radio background colors across browsers
https://jsfiddle.net/razdo3eq/
Chrome on Windows:
rgb(0,92,200) and rgb(0,117,255)
Firefox on Windows:
rgb(0,96,223) for both
Is there any way to get these colors dynamically, either per JavaScript or via CSS descriptions like -webkit-link or -moz-hyperlinkText?
·
Juan Pablo Isaza
1 answers
Answer question0
A radio button is a native element specific to each OS/browser. There is no way to change its color/style
A quick fix would be to overlay the radio button input style using :after, however it's probably a better practice to create your own custom toolkit.
input[type='radio'] {
-webkit-appearance:none;
width:20px;
height:20px;
border:1px solid darkgray;
border-radius:50%;
outline:none;
}
input[type='radio']:before {
content:'';
display:block;
width:60%;
height:60%;
margin: 20% auto;
border-radius:50%;
}
input[type='radio']:checked:before {
background:green;
}<input type='radio' name='a' checked/>
<input type='radio' name='a'/>
·
Juan Pablo Isaza
Report
Answer question