How to style your radio button?

Anthony

8 years ago

How to style your radio button? Using simple CSS, you can do whatever styles in your radio button (<input type=”radio” value=”my radio button” />). Try this code your own.

Output:

my radio button
my radio button

input[type=radio] {
    -webkit-appearance: textfield;
    background: green;
    border: 5px solid #000;
    padding: 7px;
    border-radius: 50%;
}  
input[type=radio]:checked {
    background: red;
    border: 5px solid blue;
    padding: 7px;
    border-radius: 50%;
}

Happy CSS coding.