Einfügungs-Eigenschaften

In CSS steuern Einfügungs-Eigenschaften die Position von positionierten Elementen, indem sie Offsets von den Standardpositionen der Elemente angeben. Es gibt physische, logische und Kurzschreibweisen der Einfügungs-Eigenschaften.

Die Einfügungs-Eigenschaften umfassen die physischen Eigenschaften top, left, bottom und right, ihre flussrelativen logischen Eigenschaft Äquivalente inset-block-start, inset-block-end, inset-inline-start und inset-inline-end, sowie die Kurzschreibweisen inset-block, inset-inline und inset.

Physische Eigenschaften beziehen sich auf spezifische physische Seiten eines Elements. Logische Eigenschaften verwenden richtungsabhängige Schlüsselwörter relativ zu den Block- und Inline-Achsen. Die Blockachse bezieht sich auf die Achse, die die Stapelreihenfolge von Elementen in einem Block-Layout definiert. Die Inline-Achse ist senkrecht zur Blockachse und repräsentiert die Richtung, entlang der Inline-Inhalt wie Text innerhalb eines Blocks fließt. Die Zuordnung hängt vom writing-mode, direction und text-orientation des Elements ab.

Die Interpretation der Einfügungs-Eigenschaften hängt vom Wert der position-Eigenschaft ab. Wenn position: absolute gesetzt ist, stellen sie Einfügungen von dem enthältenden Block oder dem Ankerelement dar. Mit position: relative stellen sie Einfügungen von der Standardmargenrandecke der Box dar. Mit sticky stellen sie Einfügungen vom Rand des Scroll-Containers dar. Der fixed-Wert ähnelt absolute, außer dass das Element relativ zu seinem festen Positionierungs-enthältenden Block positioniert und dimensioniert wird, der oft das Ansichtsfenster ist.