hr with an image thru css

Question

Hi,

I find this a pain. I am trying to get CSS to use an image when the < hr /> tag is used. I am currently using:

hr
{
    display:block;
    border:none;
    height:10px;
    background-image:url('img/ruler.gif');
}

However, I always get a border around the image. As you can see, the border:none does nothing.

I know there are alternative ways such as using div. But is it possible through using the hr tag only?

The main users will be using IE6, so need a IE6 compatable solution please. Thanks

Answer 1

This should help.

http://blog.neatlysliced.com/2008/03/hr-image-replacement/