Blog Directory
blog address: http://findnerd.com/list/view/custom-checkbox-and-radio-button-using-pure-css/3173
keywords: Custom Checkbox, Custom Radio Button, Radio Button, Checkbox, html
member since: Dec 8, 2015 | Viewed: 588
How To create Custom Checkbox and Radio Button Using Pure CSS
Category: Education
In this blog we are going to explain how to create custom checkbox and radio button using CSS. I have write CSS and HTML code separately, You can easily understand complete code. This blog is very useful for developers. radio-checkbox-button
CSS :-
**/*Radio button*/
.radio, .checkbox{display: inline-block;}
.radio { padding:5px; margin-left:40px; }
.radio input[type="radio"] { opacity: 0; position: absolute; cursor:pointer;}
.radio input[type="radio"] + label { color:#555; line-height:25px; display:inline-block; text-indent:-38px; }
.radio input[type="radio"]:checked + label > mark:before { content:' '; background:#0d7fbe; width:12px; height:12px; display:inline-block; margin:4px; border-radius:20px;}
......
HTML : -
{ More Related Blogs }