CSS Kochbuch

1.16 Absolute Positionierung

Problem

Sie wollen ein Element anstelle seiner Standardposition im Dokument frei im Ansichtsbereich anordnen.

Lösung

Weisen Sie im Stylesheet der Eigenschaft position für das betreffende Element den Wert absolute zu. Mit Hilfe der Eigenschaften top, right, bottom und left können Sie angeben, wie das Element positioniert werden soll.

.absolute {
 position: absolute;
 top: 50px;
 left: 100px;
}

Diskussion

Durch den Wert absolute für die Eigenschaft position wird das Element aus dem normalen Textfluss des Dokuments herausgenommen und anhand weiterer Angaben an einer bestimmten Stelle im umgebenden Block platziert.^[3] Der Beispielcode unserer Lösung weist den Browser an, Elemente der Klasse absolute genau 50 Pixel unterhalb des ...