Kai Lahmann: Element mittig positionieren

Beitrag lesen

hi

<div style="
         position:fixed; left:0; top:0;
         margin:0px;padding:10px;
         height:100%;width:300px;
         background-color:#ff0000;">
  </div>

<div style="
         position:relative;
         text-align:center;
         margin:auto;">
  </div>

da die beiden <div> nacheinander sind, deckt der obere die komplette Seite an (in der höhe). Der andere sitzt darunter. (IE kann kein position:fixed!)
In Mozilla ist der untere für die Positionierung des oberen nicht vorhanden (DER kann position:fixed), daher sitzt er selbst oben.
Mit position:absolute machen's beide gleich.

Wenn du das untere div jetzt IN das obere legst, wird es u.a. in Mozilla und IE6 vertikal und horizontal in ersten zentriert.

  • Der IE macht um das erste Div einen Abstand herum, auch margin:0px; left:0; top:0; bringen da nix :-(

margin:0px für body festlegen.