CSS position – Elemente positionieren

Bestimmt, wie ein Element positioniert werden soll.

Beschreibung und Syntax zu CSS position

position: absolute;
position: fixed;
position: relative;
position: static;

Erläuterung der Eigenschaften

Position absolute
Positionierte Elemente liegen nicht im normalen Textfluss und stehen damit über anderen Elementen. Ausgerichtet werden kann Position absolute mittels top, right, left, bottom. Die Positionierung bezieht sich auf das Elternelement. Info: wird zum Blockelement!

Position fixed
Für Internet Explorer erst ab Version 6 unterstützt. Positioniert ein Element ähnlich wie Position absolute positionierbar, liegt aber im normalen Textfluss. Beim Scrollen bleibt das Element an der eingestellten Position fest stehen. Positioniert werden kann dieses mittels top, left, right, bottom Angaben. Beachte, dass ein Scroll nicht möglich ist. Bei zu großen fixed Element könnte dies im unsichtbaren Bereich des Browsers liegen und eine Navigation damit unmöglich machen.
Diese Positionierung eignet sich für Feedback, Support/FAQ oder Account Symbole, die immer im Sichtbereich des Benutzers liegen.

Position relative
Liegt im Textfluss und kann mittels top, right, bottom, left Angaben positioniert werden. Andere Elemente um dieses relativ positionierte Element verhalten sich aber so, als wäre es nicht positioniert worden. Diese Positionierung eignet sich unter anderem für Effekte.

Position static
Liegt ebenfalls im normalen Textfluss. Das Element kann nicht mittels top, right, bottom, left positioniert werden! Hier eignen sich die Eigenschaften für den Außenabstand Margin.

Informationen und Werte

Vererbbar: Nein
Initialwert: static
Werte: absolute, fixed, relative, static