[olsserik]

Hej!
Jag har trixat bra länge med följande kod, får det inte att fungera i IE6.

bg_paa.png är en större bild som bildar en ram till intro.jpg.
Det funkar fint i IE8 och FF, men i IE6 (kan inte testa IE7) förblir bg_paa.png ovanför intro.jpg med resultatet att intro.jpg inte syns.

Har provat med en massa trix för att komma runt den där IE6-7 buggen med att z-index skapar ny stackordning titt som tätt, men lyckas inte, någon css guru som kan hjälpa mig?

Koden:

<!-- HTML:n -->
<div class="paa">
<div class="innehalldiv">
<div class="paa_textbox">
<div class="paa_innehall">
<h1 class="paa_titl"><a href="/intro/" rel="titel" title="introheader">Välkommen</a></h1>
<div class="paa_text">här är utdragstexten ?>
</div>
<div class="paa_knapp"><a href="/intro/" rel="titel" title="introheader">Läs vidare...</a>
</div>
</div>
</div>
<div class="paa_bildbox">
<div class="paa_bild" style="background: url(/bilds/intro.jpg) no-repeat; ">
</div>
</div>
</div>
</div>
<!-- Slut html -->

/* CSS:en */
.innehalldiv {position:absolute; width:980px; height:100%; left:0; top:0; visibility:hidden;filterrogidXbildTransform.Mi crosoft.alpha(opacity=100); -moz-opacity:1; opacity:1}
.paa {display:block; position:relative; z-index:-999; width:980px; height:400px; margin:10px auto; background: url(bilds/blue/bg_paa.png) no-repeat;}
.paa_textbox {float:left; display:block; width:410px; height:315px; margin:45px 0 20px 20px;}
.paa_titl {}
.paa_text {display:block; height:120px;}
.paa_knapp {font:bold 13px/30px Arial, Helvetica, sans-serif; text-align:center;}
.paa_innehall {display:block; width:350px; height:320px; padding:20px 30px 20px 20px;}
.paa_bildbox {float:left; position:relative; display:block; width:540px; height:350px;}
.paa_bild {position:relative; z-index:100; display:block; width:478px; height:280px; margin:47px 0 0 6px;}