CSS background image repeat not displaying

background: url("/Img/chic/gradient.JPG") repeat-x scroll 0 0 transparent;
color: White;
cursor: pointer;
display: block;
font-size: 11px;
font-weight: bold;
margin-bottom: 1px;
padding: 2px 0 3px 15px;
position: relative;
text-decoration: none;
vertical-align: text-bottom;
width: 100px;

That is the outputted CSS on the button gotten from Firebug. The background is not displaying however.

This is how the CSS is declared in the code:

.navigationTab
{
    position:relative;
    color:White;    
    width:100px;
    font-size:11px;
    font-weight:bold;
    margin-bottom:1px;
    cursor:pointer;
    padding:2px 0px 3px 15px; 
    vertical-align:text-bottom;
    text-decoration:none;
    display: block;
    /*filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2273ba', endColorstr='#1B62A0', iOrientation=1); /* for IE */
    /*background: -webkit-grad开发者_开发百科ient(linear, left top, left bottom, from(#2273ba), to(#1B62A0)); /* for webkit browsers */
    /*background: -moz-linear-gradient(top,  #2273ba,  #1B62A0); /* for firefox 3.6+ */
    background: url(/Img/chic/gradient.JPG) repeat-x;

}

Am I declaring the background wrong?

HTML:

<a href="/Extranet/mvc/Indications.cfc/rates/8bfe5685-5de1-4cba-b5bd-9c128fb513bb" class="navigationTab" id="ctl00_ratesLink">
    <img src="/Extranet/img/chic/plugin.png" style="vertical-align: text-bottom;"><span style="padding-left: 5px;">Rates </span>
</a>

Have you checked that the image path is correct?

One thing to watch out for is that if the style is defined in an external style sheet, relative image paths are relative to the .css file not the HTML page.