ColumnLayout

Grundlagen

Best practices

• Zu viele Spalten können den Content überladen und unübersichtlich machen. In der Regel reichen maximal 4 Spalten aus.
• Integriere bei Bedarf mehrere ColumnLayouts ineinander, um Inhalte optisch zu gruppieren.
• Wähle die Spaltenbreiten bewusst: Einheitliche Breiten schaffen ein harmonisches Layout, während unterschiedliche Breiten den Fokus des Users auf breitere Inhalte lenken.
• Verwende das ColumnLayout in Kombination mit der Section, um einfach übersichtliche Layouts zu erstellen.

Verwendung

Verwende ein ColumnLayout, um ...

• das Layout eines Dashboards festzulegen.
• Formularfeldern eine klare Struktur zu geben.
• Inhalte auf unterschiedlichen Geräten übersichtlich darzustellen.

---

Verhalten

Responsive layout

Das ColumnLayout folgt folgenden Breakpoints:

• Größe s bis 550 Pixel Breite: [1]
• Größe m bis 850 Pixel Breite: [1, 1]
• Größe l ab 851 Pixel Breite: [1, 1, 1]

Beachte, dass die Breakpoints sich nicht auf die Bildschirmgröße des Endgeräts beziehen. Sie beziehen sich auf die Breite des Containers, in dem das ColumnLayout verwendet wird. Für jeden Breakpoint kann sowohl die Anzahl der Spalten als auch deren Größenverteilung individuell festgelegt werden (siehe Overview). So bricht das Layout automatisch um, wenn es eine bestimmte Breite unterschreitet.