IE7, z-index will nicht !

[rizzle]

Hallo Gemeinde,
ich habe da eine Frage.

Ich habe eine Dropdownnavigation in einem Container, der jedoch nicht nur den Inhalt des eigenen Containers überlappen soll, sondern auch den Inhalt der darunterliegenden Container.

Also quasi so:

<div id="firstContainer">
    <ul id="navigation">
       <li>a
          <ul>
            <li>1</li>
            <li>2</li>
          </ul>
       </li>
       <li style="left: 200px">b</li>
       <li style="left: 400px">c</li>
    </ul>
    <div id="firstContent">test</div>
</div>
<div id="secondContainer">
   <p>test 2</p>
</div>

Und hier der CSS Teil:

body {
background: #333;
color: #FFF
}

#firstContainer {
width: 600px;
border: 1px solid #FF0;
position: relative;
}

ul {
background-color: #000;
position: relative;
list-style: none;
padding: 0;
margin: 0;
height: 40px;
}

ul li {
background-color: #000;
position: absolute;
width: 200px;
top: 0px;
height: 40px;
z-index: 2
}

ul li ul {
position: absolute;
top: 41px;
left: 0;
z-index: 2
}

ul li ul li {
position: relative;
z-index: 2
}

#secondContainer {position: relative;}
#secondContainer p {z-index: 1}

Wie kann ich dieses Verhalten ändern ?

[gast42]

Wie kann ich dieses Verhalten ändern ?

welches Verhalten?