CSS/Eigenschaften/position

Die Eigenschaft position entfernt Elemente aus dem normalen Elementfluss und positioniert sie an jede beliebige Stelle (auch außerhalb) des Viewports.

erlaubte Werte	absolute: losgelöst vom Textfluss, an eine Stelle, die per left, right, top und bottom festgelegt wird. fixed: starr am Viewport ausgerichtet, mit left, right, top und bottom festgelegt relative: Bezugspunkt für absolut positionierte Kindelemente static: Element verbleibt im Textfluss sticky: behält Position im Elementfluss, bis das obere oder untere Seitenende erreicht wird und bleibt dort „kleben“ Vererbung steuernde Werte inherit, initial, unset und revert Defaultwert: static
anwendbar auf	alle Elemente (Unterschied Tag Element Attribut)
Browsersupport	Details: caniuse.com
Vererbung	nein
animierbar	nein

Beispiel

aside {
  position: absolute;
  right: 5em;
  top: 2em;
}

Die aside-Box wird absolut positioniert, also aus dem Elementfluss herausgenommen. Dann wird die Position mit top und right festgelegt.

Beachten Sie: Wenn Sie Elemente absolut positionieren, wird das erste Vorfahrenelement, dessen position-Wert nicht static ist, als Bezugselement genommen. Fehlt eine solche Festlegung, ist das Bezugselement das html-Element.

Weblinks

• W3C: position property

Siehe auch

• CSS/Tutorials/Ausrichtung/position