Making XHTML Forms a Bit Sexier

One major frustration about cross-browser development is just how design-inflexible XHTML forms can be. Even with CSS, some elements (<input type="file">, <select> boxes) remain as (f)ugly as the day they were born. Unless of course we sacrifice IE6, which will alienate roughly 25% of users.

Given that, I've set off on a mini-crusade to style the un-styleable. Using some slick CSS hackery and a touch of Javascript, we can make these elements a bit more eye-friendly, and make our designers a little happier. The result is SexyForms, the start of a full form-styling JS library built off of jQuery.

SexyForms will currently help us to style the <select>, <input type="file">, <input type="checkbox"> and <input type="radio"> elements with more flexibility than normal. It's made to be lightweight and unobtrusive, and is very cross-browser with some minor quirks (to be addressed).

Documentation will also be provided soon, but for now take a look at the demo now and relieve some form-induced stress.