diTii.com Digital News Hub

Sign up with your email address to be the first to know about latest news and more.

I agree to have my personal information transfered to MailChimp (more information)

Feb252010

CSS based ‘Custom checkbox and radio buttons’

Ryan “the CSS Ninja” come up with a pretty good way of using CSS to create custom radio and checkbox inputs without JavaScript, that are accessible, keyboard controlled, don’t use any hacks and degrade nicely in non supporting browsers.

p:not(#foo) > input + label:before { background: url(gr_custom-inputs.png) 0 -1px no-repeat; position: absolute; z-index: 2; left: 16px; content: "\00a0\00a0\00a0"; /* 3x   */ overflow: hidden; width: 16px; height: 16px; margin: 0 3px 0 -16px; }

More info: Custom radio and checkbox inputs using CSS

Share This Story, Choose Your Platform!

Do NOT follow this link or you will be banned from the site!