Inset-Eigenschaften

In CSS steuern Inset-Eigenschaften die Position von positionierten Elementen, indem Versätze von den Standardpositionen der Elemente angegeben werden. Es gibt physische, logische und Kurzschreibweisen für Inset-Eigenschaften.

Zu den Inset-Eigenschaften gehören die physischen Eigenschaften top, left, bottom und right, ihre äquivalenten, flussbezogenen logischen Eigenschaften 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 bestimmte physische Seiten eines Elements. Logische Eigenschaften verwenden Richtungsschlüsselwörter relativ zu den Block- und Inline-Achsen. Die Block-Achse ist die Achse, die die Stapelreihenfolge von Elementen in einem Block-Layout definiert. Die Inline-Achse ist senkrecht zur Block-Achse und repräsentiert die Richtung, in der Inline-Inhalte wie Text innerhalb eines Blocks fließen. Die Zuordnung hängt vom writing-mode, direction und text-orientation des Elements ab.

Die Interpretation der Inset-Eigenschaften hängt vom Wert der position-Eigenschaft ab. Wenn position: absolute gesetzt ist, stellen sie Versätze vom Containing Block oder Anchor-Element dar. Mit position: relative repräsentieren sie Versätze von der Standardposition des Margin-Randes des Elements. Bei sticky stellen sie Versätze vom Rand des Scroll-Containers dar. Der Wert fixed ist absolute ähnlich, außer dass das Element relativ zu seinem festen Positionierungs-Containing-Block positioniert und dimensioniert wird, welcher oft der Viewport ist.

Siehe auch