CSS/Eigenschaften/position

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

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

Siehe auch