IE6 Background Image on link not shown when wrapped in span

Question

I have an issue in IE6 but not IE>=7, FF or Chrome. It is caused when you wrap an anchor tag with a span.

<span><a href="place"><span>Text</span></a></span>

However this works:

<h1><a href="place"><span>Text</span></a></h1>

The only styling on them is as below:

div#headeraffiliate a.skin_3 {
    width: 550px !important; height: 53px !important;
    background: transparent url('images/logo_skin3.gif') top left no-repeat !important;
}

div#header a#logo span,
div#headeraffiliate a#logo span {position: absolute; margin-left: -1000em;}

div#header a#logo,
div#headeraffiliate a#logo {
    display: block;
    width: 297px; height: 69px;
    z-index: 1000;
    position: absolute; left:0; bottom:0;
    background: transparent url('images/logo.gif') top left no-repeat;
}

Answer 1

I believe the difference here is a H1 tag is a block level element where as a span is an inline element. It may work if you use <span style="display:block">

Answer 2

I would suspect this is the cause:

div#headeraffiliate a#logo span {position: absolute; margin-left: -1000em;}

It is positioning your link off-screen.