Background color showing behind images?

Hi all, I have a quick question here...

I have this DIV and it is filled in with some stuff. At the bottom of the div I have a image that rounds the bottom corner of the box off.

In FF it shows correctly, but in IE, there is several pixels that show the background color (which I need for other parts of the box) past the image.

See my screenshot... What can I do to get rid of this? Thanks!

http://img232.imageshack.us/my.php?image=capture1tx4.jpg

 

Make the image png and, slice it and use transparency. That should do it.

 

Er... no, the problem is that the div is extending past where it should be by several pixels causing the line across the bottom, which is the background color for the div.

The CSS for the div has no height defined, but neither can it.

Here is the css for the div in question: Remember, the only problem is that div is extending several pixels past where the last image in the div is, ruining the rounded bottom edge effect.

.product-box {
float:right;
width:251px;
margin-left:35px;
}

.product-box h3 {
font-size:20px;
margin:0;
padding:0;
}

.product-box p {
margin:2px;
padding:0;
}
.product-box ol {
list-style:none;
margin-top:8px;
}
.product-box ol li {
margin-bottom:3px;
}

 

Looks as if your background is repeating on the y axis in the div. IE may be adding px to the height unexpectedly. I didn't see where in your css you were setting a background but i imagine your using an image set as the background. Try setting no repeat on that element.