z-index bei mit relative positionierten elementen?
max
- css
hey,
ich sitze jetzt schon sein 2 stunden bei diesem problem:
ich will 2 mit relative positionierte div-boxen überlappen lassen. mit absolute funktionierts tadellos, ich will die boxen aber auf der seite zentriert haben.
hier der code:
<div style="text-align:center;">
<div style="position:relative;left:300px;background-image: url('gfx/bg/kabel.gif'); width:370px; height:585px;margin:auto;z-index:1;"></div>
<div style="position:relative; width:445px; height:291px; top: 0px;margin:auto ;z-index:2;">
<img src="gfx/top/banner.gif">
</div>
<div style="position:relative; top: 10px; z-index:3;">
<div style="postition:relative; margin:auto;">
<img src="gfx/top/nav01.gif"><img src="gfx/top/nav02.gif"><img src="gfx/top/nav03.gif"><img src="gfx/top/nav04.gif"><img src="gfx/top/nav05.gif"><img src="gfx/top/nav06.gif">
</div>
</div>
</div>
das kabel aus kabel.gif soll den banner und die nav-leiste in einer art halbkreis umschließen.
bin für jeden tipp dankbar!
lg, max
setze ein wrapper als ultimatives div
<body>
<div style="margin:0 auto;position:absolute;"><!-- wrapper -->
<div id="div1_navi"></div>
<div id="div2_textContent"></div>
</div><!-- wrapper end -->
</body>
die beiden kannste jetzt absolute machen und müsten "zentiert" sein (nicht sehr elegant aber sollte sien zweck erfüllen) :)
css-dateien sind unsere freunde :)
mfg
Benjamin
setze ein wrapper als ultimatives div
<body>
<div style="margin:0 auto;position:absolute;"><!-- wrapper -->
<div id="div1_navi"></div>
<div id="div2_textContent"></div>
</div><!-- wrapper end -->
</body>die beiden kannste jetzt absolute machen und müsten "zentiert" sein (nicht sehr elegant aber sollte sien zweck erfüllen) :)
css-dateien sind unsere freunde :)mfg
Benjamin
hallo,
vielen dank für deine antwort. allerdings funktioniert das nicht, da wird nichts zentriert.
ich formulier meine frage mal anders: wie kann ich denn ein div mit absolute definieren und dabei auf der seite zentrieren?
lg,
max