css (RSS)

CSS Freedom - Redesign HTML Form Elements As You Like

June 28, 2008 in css

Ryan Fait presents a method to customize the booring html form elements with css and a little javascript to that you have always dreamed of. It will allow you to use custom images for checkboxes, radio buttons and select lists.

custom-form-elements CSS Freedom - Redesign HTML Form Elements As You Like

The unobtrusive script gracefully degrades, so if JavaScript is disabled, normal form input objects appear instead of your customized elements. This works flawlessly in Firefox, Safari, Internet Explorer 7, Opera and others. In Internet Explorer, the select lists are unstyled, but the checkboxes and radio buttons still look and function beautifully. Check out the demo.

The technology is pretty similar to that was used on our mediaplana contact site called niceforms (demo here) by badboy. An example is shown below.
custom-form-elements-mediaplana CSS Freedom - Redesign HTML Form Elements As You Like

If you have a good example for awesome looking forms, please let us know and post it as a comment.

Spread the words

Digg Del.icio.us Stumble Float Technorati Bump
Whatever you want to say!
Leave a Comment »
Leave a comment!
Note: You can also use your free Gravatar avatar on Knowtebook! Please also read our Publishing Policy before posting.

Ja, ich möchte bei Kommentaren benachrichtigt werden!

Trackbacks/Pings
Trackback-URL

Redesign HTML Form Elements As You Like | CSS-FAQ
Jun 28, 2008
ID: 1

[…] Fait presents a method to customize the booring html form elements with css and a little javascript to that you have […]