Flex-Direction
Code Sources Icon Code Sources Icon

Mit der Eigenschaft "flex-direction" die dem "Container" zugewiesen wird, können die Flex-Items in Spalten oder Zeilen geordnet werden.

  • flex-direction:row; (Standard)
    Die Flex-Items werden nebeneinander in einer Reihe aufgeführt in der sie notiert sind.
  • flex-direction:row-reverse;
    Die Flex-Items werden nebeneinander in einer Reihe aufgeführt in umgekehrter Reihenfolge.
  • flex-direction:column;
    Die Flex-Items werden von oben nach unten dargestellt (Spalten).
  • flex-direction:column-reverse;
    Die Flex-Items werden von unten nach oben, also in umgekehrter Reihenfolge dargestellt (Spalten Umkehr).

Der Quelltext wurde erfolgreich in die Zwischenablage kopiert.
HTML Elemente

Anregung:

Du kannst die vier Eigenschaften von "flex-direction" testen, indem du sie in den CSS-Eigenschaften des Containers der Reihe nach wechselst:

flex-direction: row;
flex-direction: row-reverse;
flex-direction: column;
flex-direction: column-reverse;

Ohne die div-Elemente im Container zu verändern, kannst du ihre Anordnung über den Eltern-Container verändern.

DB-Table: flex-direction