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.

Flexbox und Grid: das moderne CSS-Layout

Flexbox und Grid: das moderne CSS-Layout

Im Folgenden lernen Sie Flexbox und Grid kennen, das sind 2 moderne CSS-Layout Module, mit denen Sie sich jenseits vom Block Formatting Context bewegen, denn Flexbox und Grid erzeugen jeweils einen neuen, einen eigenen Formatting Context. Für Flexbox gibt es die Deklaration display: flex, und damit wird ein Flex Formatting Context erzeugt, und für das CSS Grid Layout Modul gibt es die Deklaration display: grid, und damit erstellt man einen Grid Formatting Context. Diese Begriffe können Sie im Alltag wieder vergessen, aber es ist sehr schön, um deutlich zu machen, dass Sie sich wirklich in einer völlig neuer Umgebung zum Layouten begeben mit diesen beiden Deklarationen. In beiden neuen Formatting-Kontexten gibt es neue Eigenschaften und neue Werte, die sich vorzüglich zum Layouten eignen, und mit denen man mehrspaltige responsive Layouts viel besser realisieren kann, als mit Eigenschaften wie Position und Float. Flexbox mit display: flex ist ideal geeignet für eindimensionale Layouts…

Inhalt