<self-position>

Der <self-position> aufgezählte Wertedatentyp wird von den Eigenschaften justify-self und align-self, sowie der Kurzform place-self verwendet, um das Box-Element innerhalb seines Ausrichtungscontainers auszurichten. Er wird auch von den Eigenschaften justify-items und align-items und der Kurzform place-items genutzt, um Standardwerte für justify-self und align-self zu definieren.

Syntax

<self-position> = center | start | end | self-start | self-end | flex-start | flex-end

Werte

Die folgenden Schlüsselwortwerte werden durch den <self-position>-Grammatikbegriff dargestellt:

center

Zentriert das Ausrichtungsobjekt innerhalb seines Ausrichtungscontainers.

start

Richtet das Ausrichtungsobjekt bündig mit der Startkante des Ausrichtungscontainers aus.

end

Richtet das Ausrichtungsobjekt bündig mit der Endkante des Ausrichtungscontainers aus.

self-start

Richtet das Ausrichtungsobjekt bündig mit der Kante des Ausrichtungscontainers aus, die der Startseite des Ausrichtungsobjekts entspricht.

self-end

Richtet das Ausrichtungsobjekt bündig mit der Kante des Ausrichtungscontainers aus, die der Endseite des Ausrichtungsobjekts entspricht.

flex-start

Im Flex-Layout richtet es das Ausrichtungsobjekt bündig mit der Kante des Ausrichtungscontainers aus, die der Haupt-Start- oder Kreuz-Start-Seite des Flex-Containers entspricht, wie angebracht. Es ist identisch mit start für andere Layout-Modi als das Flex-Layout.

flex-end

Im Flex-Layout richtet es das Ausrichtungsobjekt bündig mit der Kante des Ausrichtungscontainers aus, die der Haupt-End- oder Kreuz-End-Seite des Flex-Containers entspricht, wie angebracht. Identisch mit end für andere Layout-Modi als das Flex-Layout.

Hinweis: Die Schlüsselwörter left und right sind von <self-position> ausgeschlossen, obwohl sie gültige positionsbezogene Ausrichtungswerte für die justify-* Eigenschaften (justify-content, justify-self, und justify-items) sind, da sie in den align-* Eigenschaften (align-content, align-self, und align-items) nicht erlaubt sind. Sie sind stattdessen ausdrücklich in die Grammatiken der justify-* Eigenschaften aufgenommen.

Spezifikationen

No specification found

No specification data found for css.types.self-position.
Check for problems with this page or contribute a missing spec_url to mdn/browser-compat-data. Also make sure the specification is included in w3c/browser-specs.

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch