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“

Inline-Elemente, die position:absolute oder relative zugewiesen bekommen, werden zu Block-Elementen!

Vererbung steuernde Werte inherit, initial, unset und revert
Standardwert

static

anwendbar auf

alle Elemente

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.

Siehe auch

Weblinks