Wednesday, October 11, 2006

Styled Checkboxes and Radio Buttons

I'm sure you've experienced the problem - most form elements can be styled pretty easily, but checkboxes and radio buttons? Forget it. If you're anything like me, you probably gave up by now and accepted that it's just one of those things you have to put up with. However, Philip Howard has released a nice CSS and JS solution that allows you to wrap a span of a certain class around the elements you want styled, and the magic pixies will do the rest.

I've seen this done before, but this solution is worth highlighting because :

  • It degrades gracefully back to the standard form elements if your browser does not support JS, CSS or images, and
  • He's put the extra bit of effort in to support the standard keyboard controls for form elements - space bar toggles status, left and right move the focus along a group of radio buttons, etc.

Nice one Philip.

1 comment:

blogOmatic said...

Kewl Work there brotha !

SEO Houston