# Form button with two colours using CSS



## sujeeth_it (Mar 6, 2006)

Hi all,

I want to know that can we give multiple colours to a form submit button or normal button using css like we will give width, border colour for it.

If possible please help me on that.

Regards,
Sujit Joshi


----------



## Rockn (Jul 29, 2001)

You can give a button a background and border colors using CSS...TRUE

.button {
background-color: #9999FF;
border-top-width: 1px;
border-right-width: 1px;
border-top-style: solid;
border-right-style: solid;
border-top-color: #999999;
border-right-color: #666666;
}


----------



## namenotfound (Apr 30, 2005)

You can also give it a different color on mouseover as so:

.button:hover {
--the stuff--
}


----------



## sujeeth_it (Mar 6, 2006)

Thanks Rockn,

But actually i needed the code which gives multiple colours or like shading effect to form button. The code mentioned will give a single colour and border colour to button.

If anybody know how to give multiple colours to button help me regarding that.

Sujit Joshi


----------



## knight_47 (Mar 15, 2006)

I'm not a pro at this, but why don't you create an image to what you need, and use that? I'm pretty sure you can use the hover attribute with it too.


----------



## namenotfound (Apr 30, 2005)

Yep, that's possible CTI 
Just give the button a background-image and if you want a hover effect, just add a different background-image for :hover


----------



## sujeeth_it (Mar 6, 2006)

Thanks,

I know i can use image with shading effect background colour. But i want to use form submit button with shading background colour. Is it possible?

Regards,
Sujit Joshi


----------



## namenotfound (Apr 30, 2005)

No, not with any element.
All the "shading" effects you see, are done with images.

For example:










You can't get that shading effect without using an image.


----------



## brendandonhu (Jul 8, 2002)

You can shade in CSS in some browsers
http://www.webreference.com/programming/css_stylish/


----------



## namenotfound (Apr 30, 2005)

Key word _some_.

Personality, I never use code that only works in some browser and not others. Plus the fact that Microsoft filters isn't a w3c recommendation, so you'll get erros when validating the CSS.


----------



## brendandonhu (Jul 8, 2002)

As long as it follows graceful degradation I don't see what the problem is. Its better to have your shading effect in some browsers than none it all, and its not like the IE-only code is going to stop it from working in other browsers. You could even use the filter in browsers that support it and load the image in browsers that don't support it.


----------



## TechGuy (Feb 12, 1999)

This thread has obviously outlived its usefulness, and I somehow doubt that the last page or two offers any help whatsoever to the original poster. I'm going to close it before it grows into any more of a flamewar.


----------



## JohnWill (Oct 19, 2002)

I've removed most of the arument, both of you guys should take this "discussion" to your own thread if needed.


----------



## ~Candy~ (Jan 27, 2001)

What a mess


----------

