Aus dem Kurs: Webtechniken lernen 3: Responsive CSS-Layouts mit Media Queries, Flexbox und Grid

So erhalten Sie Zugriff auf diesen Kurs

Werden Sie noch heute Mitglied und erhalten Sie Zugriff auf mehr als 23.200 Kurse von Branchenfachleuten.

Die Ausrichtung von Flex-Items kontrollieren mit justify-content, align-items und align-self

Die Ausrichtung von Flex-Items kontrollieren mit justify-content, align-items und align-self

Aus dem Kurs: Webtechniken lernen 3: Responsive CSS-Layouts mit Media Queries, Flexbox und Grid

Die Ausrichtung von Flex-Items kontrollieren mit justify-content, align-items und align-self

Nach der Fließrichtung von Flex-Items geht es jetzt um die Ausrichtung von Flex-Items, und dazu gibt es unter anderem die Eigenschaften justify-content, align-items und align-self. Die Namen dieser Eigenschaften sind ein bisschen gewöhnungsbedürftig, aber das geht recht schnell, denn sie sind wirklich Klasse. Los geht's mit justify-content, also Ausrichten des Inhalts. justify-content wird dem Flex-Container zugewiesen, also in unserem Falle der Navigation, dem ul Element. justify-content kontrolliert die Ausrichtung der Flex-Items entlang der Hauptachse. justify-content arrangiert den Leerraum zwischen den Flex-Items. Das heißt, also wenn es keinen Leerraum geben sollte, dann hat die Eigenschaft überhaupt keine Auswirkung. Mögliche Werte auf einem Blick der Standardwert flex-start, dann das Gegenteil flex-end, dann center, space-between, space-around und space-evenly. Sie sehen, hier sind keine Werte, die irgendwie die Begriffe links oder rechts drinnen haben, das ist absichtlich so,…

Inhalt