• Horizontal CSS Menus
• Vertical CSS Menus
• Image CSS
• Form CSS
• DIVs and containers
• Links & Buttons
• CSS3 demos
• Other
• Browse All

• Hosting Discounts

• Layouts Index
• Two Columns
• Three Columns
• Fixed layouts
• Liquid Layouts
• CSS Frames

CSS Library: Form CSS: Here

Stylish submit buttons

Author: Dynamic Drive

Most people would agree the default look of submit buttons is rather dull and unattractive. Using CSS and a nice gradient background image, it's easy to transform a form button from a duck to a swan.

Demo:

The image used:

The CSS:

<style type="text/css"> .formbutton{ cursor:pointer; border:outset 1px #ccc; background:#999; color:#666; font-weight:bold; padding: 1px 2px; background:url(media/formbg.gif) repeat-x left top; } </style>

The HTML:

<form> <input type="text" style="width: 200px; border: 1px solid gray" /> <input type="submit" class="formbutton" value="Submit" /> </form>

Copyright 2006-2016 Dynamic Drive