HTML CSS examples for CSS Widget:Button
Scale transform radio button
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> input[type=radio] { visibility:hidden; } .label {<!-- w w w . j a v a2 s . co m--> font-weight:normal; color:Chartreuse; } .label::before { content:''; position:absolute; left:0; width:39px; height:39px; border:2px solid yellow; border-radius:51%; } .container { line-height:39px } input[type=radio]:checked + label:after { content:''; position:absolute; width:39px; height:39px; line-height:2px; left:0; background:blue; border:none; transform:scale(0.6); border-radius:51%; } </style> </head> <body> <div class="container"> <input type="radio" id="radio1" value="on"> <label for="radio1" class="label">Yes</label> </div> </body> </html>