Überlagerung relativer und absoluter Elemente im Opera
Bobby
- css
Moin
Ich habe folgendes Problem. Ich habe 2 absolut positionierte Bilder, welche auf die unterste Ebene müssen. Darüber sollen 2 relativ positionierte Elemente folgen.
Auf der linke Seite funktioniert es und auf der rechten nicht. Warum??
Hier der Code:
CSS:
#container
{
position:relative;
text-align:left;
margin:auto;
width:942px;
min-height:100%;
background: url("../images/bg_cont.gif") repeat-y;
}
#verlauf-left
{
position:absolute;
bottom:0px;
left:40px;
z-index:2;
}
#verlauf-right
{
position:absolute;
bottom:0px;
left:271px;
z-index:2;
}
#element
{
position:relative;
z-index:100
}
#left
{
float:left;
width:240px;
height:100%;
padding-bottom:150px;
}
#content
{
float:left;
width:702px;
position:relative;
z-index:100
}
#titel
{
float:left;
margin-left:4px;
}
#txt
{
height:100%;
position:relative;
z-index:100;
float:left;
width:432px;
margin:35px;
margin-left:45px;
margin-top:0px;
}
HTML:
<div id="container">
<img src="images/verlauf-left.jpg" width="196" height="358" id="verlauf-left"/>
<img src="images/verlauf-mitte.jpg" width="456" height="265" id="verlauf-right"/>
<div id="left">
<div style="height:90px;" id="Platzhalter-fuer-Logo">
</div>
<img src="<?php echo WEBDIR;?>images/left.gif" width="224" height="245" alt="left (28K)" id="element" />
</div>
<div id="content">
<img src="<?php echo WEBDIR;?>images/titel.gif" width="698" height="57" alt="titel (17K)" id="titel" />
<div id="txt">
</div>
</div>
</div>
wie gesagt, im Opera überlagert das Bild "element" Das Bild "verlauf-left", Im Gegesatz dazu überlagert aber das Bild "verlauf-right" den DIV "txt". Was aber genau andersrum sein soll. Ich hoffe ich hab mich verständlich genug ausgedrückt.
Sieht jemand den Fehler?
Gruß Bobby