Issues with Internet Explorer and background not showing

I'm having a few issues with my background not showing for my button elements.

Here's my CSS code:

button.button-master-lite, a.button-master-lite {
    background: #92AE41;
    background: -moz-linear-gradient(top, #89A73E 0%, #92AE41 100%);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#89A73E), to(#92AE41));

    border: 1px solid #89A73E;
    border-bottom: 1px solid #92AE41;

    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;

    -moz-box-shadow: inset 0 1px 0 0 #92AE41;
-webkit-box-shadow: inset 0 1px 0 0 #92AE41;
    box-shadow: inset 0 1px 0 0 #92AE41;

    color: #fff;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
font-size: 11px;
    font-weight: bold;
    line-height: 1;

    padding: 5px 8px 6px 8px;
    text-align: center;
    text-shadow: 0 -1px 0 #5D862F;
    width: auto;
}

And here's my HTML:

<a class="button-master-lite" href="#">Order Now</a>

With IE 6 and IE 7 the background-color does not show. However, when I take off the other background declarations except the first one, the background shows.

The HTML page I have this button on has a n开发者_StackOverflow中文版umber of divs and sub-divs with floats and position style elements, but I can't figure out which one is causing the issue. I tried putting the code on a completely blank page with only my stylesheet and it worked ok.

Is there anything in particular that would be causing the background not to show when I have other background declarations for other browsers?! Does it have anything to do with floats or other positioning elements?

I'd appreciate some assistance. Thanks.

You're resetting the background right after you set it. Use background-color for setting the color and then background-image for those CSS3 gradients.

Demo: http://codetester.org/2cef201d

This site helps a lot! http://css3please.com/

try using background-color and background-image properties like so:

button.button-master-lite, a.button-master-lite {
    background-color: #92AE41;
    background-image: -moz-linear-gradient(top, #89A73E 0%, #92AE41 100%);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#89A73E), to(#92AE41));
    border: 1px solid #89A73E;
    border-bottom: 1px solid #92AE41; 
    -moz-border-radius: 3px; 
    -webkit-border-radius: 3px; 
    border-radius: 3px; -moz-box-shadow: inset 0 1px 0 0 #92AE41;
    -webkit-box-shadow: inset 0 1px 0 0 #92AE41; 
    box-shadow: inset 0 1px 0 0 #92AE41; 
    color: #fff; 
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    font-size: 11px; 
    font-weight: bold; 
    line-height: 1; 
    padding: 5px 8px 6px 8px; 
    text-align: center; 
    text-shadow: 0 -1px 0 #5D862F; 
    width: auto;
}

Add display:block or display:inline-block