Background-Image working in IE but not Firefox

Here's my css code:

HTML Code:

---

/*GridViewCSS White Chrome Style*/
.GridViewStyle
{
    font-family: Arial, Sans-Serif;
    font-size:small;
    table-layout: auto;
    border-collapse: collapse;
    border:#999999 1px solid;
}
/*Header and Pager styles*/
.HeaderStyle, .PagerStyle
{
    background-image: url('../Images/HeaderWhiteChrome.jpg');
    background-position:center;
    background-repeat:repeat-x;
    background-color:#fff;
        border-bottom:solid 1px #999;

   
}
.HeaderStyle th
{
    padding: 5px;
    color: #333;
   
}
.HeaderStyle a
{
    text-decoration:none;
    color:#333;
    display:block;
    text-align:left;
    font-weight:normal;
}
.PagerStyle table
{
    text-align:center;
    margin:auto;
}
.PagerStyle table td
{
    border:0px;
    padding:5px;
}
.PagerStyle td
{
    border-top: #999999 1px solid;
}
.PagerStyle a
{
    color:#333;
    text-decoration:none;
    padding:2px 10px 2px 10px;
    border-top:solid 1px #fff;
    border-right:solid 1px #999;
    border-bottom:solid 1px #999;
    border-left:solid 1px #fff;
}
.PagerStyle span
{
    font-weight:bold;
    color:#333;
    text-decoration:none;
    padding:2px 10px 2px 10px;
}
/*RowStyles*/
.RowStyle td, .AltRowStyle td, .SelectedRowStyle td, .EditRowStyle td
{
    padding: 5px;
    border-right: solid 1px #999;
}
.RowStyle td
{
    background-color:#E4E4E4;
}
.AltRowStyle td
{
    background-color: #fff;
}
.SelectedRowStyle td
{
    background-color:#FF9;
}

---

Here's the Gridview Html:

HTML Code:

---

<asp:GridView ID="testers" runat="server" style=" top: 200px; position: absolute;"  CssClass="GridViewStyle"     
            AllowPaging="True" PageSize="20" Width="806px"
    GridLines="None">

            <RowStyle CssClass="RowStyle" />
            <EmptyDataRowStyle CssClass="EmptyRowStyle" />
            <PagerStyle CssClass="PagerStyle" />
            <SelectedRowStyle CssClass="SelectedRowStyle" />
            <HeaderStyle CssClass="HeaderStyle"  />
            <EditRowStyle CssClass="EditRowStyle" />
            <AlternatingRowStyle CssClass="AltRowStyle" />
            <Columns>
        <asp:CommandField ShowSelectButton="True" ButtonType="Image"
                    SelectImageUrl="~/Images/glass.png" Visible="False" >
                <ControlStyle Height="30px" Width="50px" />
                </asp:CommandField>
        <asp:CommandField ShowEditButton= "True"  ButtonType="Image"
                    EditImageUrl="~/Images/rate.jpg" Visible="False"  >
                <ControlStyle Height="30px" Width="60px" />
                </asp:CommandField>
        <asp:CommandField ShowDeleteButton ="True" DeleteText="Contact" >
       
                <ControlStyle Height="30px" Width="60px" />
                </asp:CommandField>
       
        </Columns>
        </asp:GridView>

---

Any help would be greatly appreciated.

Have you checked the Error Console in Firefox to see if the image is not loading properly? You could also try checking in Firebug to see whether the image is getting fetched from the webserver. In Firebug, you would check the "Net" tab to view all the resources loaded from the webserver. Your image file should appear in this list.

You could also try running Firefox's built-in web inspector (Ctrl+Shift+I) to check the CSS for that particular page element. You can use this to check that the appropriate CSS classes are being assigned to the GridView.