Die Ausrichtung in CSS umfasst die Eigenschaften, mit denen sich Elemente in Flexbox und Grid auf beiden Achsen ausrichten lassen.
- Ausrichtung (CSS)
Die Eigenschaften, mit denen Elemente innerhalb eines Flex- oder Grid-Containers auf beiden Achsen ausgerichtet werden.
Beispiel: „Die Ausrichtung gehört an den Container, nicht an die Kinder.“
Die Namen sortieren
justify- betrifft die Hauptachse, align- die Querachse. -content verteilt die Gesamtheit im verfügbaren Platz, -items richtet jedes Element in seiner Zelle aus, -self überschreibt das für ein einzelnes Kind.
.container {
display: flex;
justify-content: space-between; /* Hauptachse */
align-items: center; /* Querachse */
}Im Raster ist es anders herum
In einem Raster meint justify- immer die waagerechte und align- die senkrechte Richtung, unabhängig von einer Flussrichtung. Das ist eine häufige Fehlerquelle beim Wechsel zwischen beiden Verfahren.