Layout

Mit CSS kann man Elemente auf einer Webseite auf unterschiedliche Arten anordnen. Hier sind die vier wichtigsten Möglichkeiten:

• Position: Mit der CSS-Eigenschaft position kann man das Verhalten von Elementen in Bezug auf ihre ursprüngliche Position im Dokument steuern. Es gibt fünf verschiedene Einstellungen: static,relative,absolute,fixed und sticky.
• Float: Mit float kann man Elemente neben anderen Elementen positionieren, indem man sie „schwimmen“ lässt. Hierbei wird das Element aus dem normalen Fluss des Dokuments entfernt und rechts oder links neben anderen Elementen positioniert.
• Flexbox: Ermöglicht es, Elemente flexibel in einer Reihe oder Spalte anzuordnen sowie die Größe und Ausrichtung der Elemente festzulegen. Diese Prinzip ist besonders nützlich für mobile Layout, da durch flexible Anordnung fast jede Bildschirmgröße abgedeckt werden kann.
• Grid: Ermöglicht es, Elemente in einem Raster anzuordnen. Hierbei kann man Spalten und Zeilen definieren und die Elemente innerhalb dieses Gitters positionieren. CSS Grid bietet eine hohe Kontrolle über das Layout und ist besonders nützlich für die Anordnung von Elementen auf größeren Geräten wie Desktops.

Jede dieser Methoden hat ihre Stärken und Schwächen und es hängt von den Anforderungen des Projekts ab, welche Methode am besten geeignet ist.

Bücher, Webtexte, Wikipedia und Artikel