Schönen guten Tag allerseits.
Diesmal komme ich mit einer wesentlich konkreteren Frage:
Angenommen, ich habe zwei ineinader verschachtelte div-blöcke:
<div id="outerBox">
die aeussere box
<div id="innerBox">
die innere box
</div>
</div>
und will die innere Box nun horizontal zentriert genau 100 px vom oberen rand entfernt bezüglich der äußeren Box positionieren.
Ich habe eigentlich gehofft, dass margin-left & margin-right auf "auto" stellen reicht:
/* irgendwie unsinnig in den raum geworfene aeussere box */
#outerBox{
background-color: green;
width: 500px;
height: 200px;
position: relative;
left: 250px;
}
/* die innere box soll genau 100px abstand vom oberen Rand der umgebenden box haben,
und bzgl. der umgebenden box in horizontaler richtung zentriert sein
*/
#innerBox{
background-color: red;
position: absolute;
top: 100px;
margin-left: auto;
margin-right: auto;
}
jedoch bewirkten diese Einstellungen keinerlei Auswirkungen: die innere box klebt am linken Rand der äußeren Box.
Wie zentriere ich nun solche absolut positionierten div-blöcke?
Entschuldigt mich, wenn die Frage euch allzugut bekannt vorkommen sollte: ich habe viele ähnliche sachen gefunden, aber irgendwie nie wirklich das, wonach ich gesucht habe.
Vielen Dank im voraus.
0x7F800000