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:
Got a question or need help customizing this CSS code? Post it in the CSS Forums. If you have a comment or suggestion instead, post it in the comments section below.
Comment Pages 1 of 8 pages 1 2 3 > Last »
Hi
Just to clarify that this effect doesn't work with Safari, you just get the basic aqua button.
cheers,
Dan
Just to clarify that this effect doesn't work with Safari, you just get the basic aqua button.
cheers,
Dan
Very nice. I'm using it on my site.
Also, in Camino you get a standard aqua button but with bold text.
I can create a div that pops up by clicking on an empty link. This div contains input fields (radio buttons, text box, and drop down list)
I would like to be able to make selections in these inputs and then dismiss this div (or move it off the screen) when the user is done.
I can do the first part... any ideas on the second part? Let me know if you need something to get started or if you can create your own popup div maybe yours will be better anyway.
I would like to be able to make selections in these inputs and then dismiss this div (or move it off the screen) when the user is done.
I can do the first part... any ideas on the second part? Let me know if you need something to get started or if you can create your own popup div maybe yours will be better anyway.
Great entry. Love to see more stuff on styling form elements.
Hi, thanks, great css. Is it possible to have the same button effect but with curved corners?
@ Tom: If you are using asp check out
http://www.codeproject.com/aspnet/CaptchaImage.asp
for integrating captcha images into your web forms.
http://www.codeproject.com/aspnet/CaptchaImage.asp
for integrating captcha images into your web forms.
thanks, indeed a good tutorial but what about hover effect in submit button? does hover works in IE as well
input [type=submit]
{
............
}
input:hover[type=submit]
{
............
}
input [type=submit]
{
............
}
input:hover[type=submit]
{
............
}
sorry im new with css but im using dreamweaver 8 i need to no where you paste the css code in the coder section of dreamweaver??
Commenting is not available in this weblog entry.


I'd like to find out what you use to generate your captcha images. I'm about to open up a page for newsletter signups and a few other things that I'd like to protect with a captcha image check.
Thanks
Tom