Image in <TD> not fitting the complete cell. (works fine in FF, but not in IE)

I am trying to add a ba开发者_StackOverflowckground image for element in the following way in css

CSS

.datebox {
    background-image: url("datebox.png");
    background-size: 100%;
    background-repeat: no-repeat;

}

JSP

<td class="datebox" valign="top"> <Table>......</Table> </td>

When I view in FF, it displays fine. But in IE, the image is not filled completed in the cell.

Thanks a lot for your help in advance.

The cell won't automatically resize to the size of its background image. In order to make sure that the cell is the same size as the image, apply the image's dimensions to your .datebox, for example

.datebox {
    width: 100px;
    height: 70px;
}

Background-size actually isn't supported in IE8 and less - See MSDN's IE compatibility chart