Code:


position legt fest, auf welche Weise ein Element in der Ansicht platziert wird: im normalen Fluss, relativ zu sich selbst verschoben oder unabhängig von anderen Elementen.

• static: Das Element erscheint im normalen Fluss, top-, bottom-, left- und right-Angaben sind wirkungslos.


• relative: Das Element wird zunächst im normalen Fluss positioniert und dann gemäß seinen top-, bottom-, left- und right-Angaben verschoben. Bezugspunkt ist dabei die 'static'-Position, also diejenige, die das Element im normalen Fluss hat. Nachfolgende Elemente verhalten sich so, als wäre das Element nicht verschoben.
  Die Größe des Elements wird durch die top/bottom- und left/right-Angaben nicht verändert, das Element wird nicht gestreckt oder gestaucht. Gegebenenfalls werden die bottom- und (bei direction:ltr) die right-Angabe vernachlässigt.


• absolute: Das Element wird unabhängig von anderen Elementen in Viewport gemäß seinen top-, bottom-, left- und right-Angaben platziert. Bezugspunkt ist die linke, obere Ecke des nächsthöheren, nicht 'static' positionierten Vorfahren-Elements.
  Beachte: Absolut positionierte Elemente sind ganz aus dem normalen Fluss herausgenommen; nachfolgende Elemente verhalten sich so, als gäbe es das
  Element gar nicht. - So lassen sich z.B. 'Popups' (ohne eigenes Fenster) und Tooltips realisieren.


• fixed: wie absolute, aber das Element orientiert sich am Viewport und scrollt nicht mit.

top, bottom, left, right: Neben 'auto' und 'inherit' sind Längenangabe oder Prozentwert möglich. Prozentangaben beziehen sich auf height oder width des nächsthöheren Vorfahren (relative), des nächsthöheren nicht-static Vorfahren (absolute) bzw. des Viewports (fixed).  



Quelle: W3C CSS 2.1:  
9.3 Positioning schemes,
9.8.2 Relative positioning,
9.8.4 Absolute positioning


>> Allgemeine Fragen oder Probleme mit dem Lexikon-Begriff? Hier gehts zum Forum!