Grid System
Ausführliche Beispielseite zum Grid: Aufteilungen, automatische Breiten, Offsets, Umbrüche und verschachtelte Raster.
Die Spalten-Container bilden Bootstraps Grid als Inhaltselemente ab. Die Breite lässt sich je Breakpoint einzeln setzen; leer bedeutet: erbt vom nächstkleineren. Interessant für den Test sind…
GrundlagenLayout#Tag 1
Layout in t3sbootstrap
Das Layout entscheidet, bevor irgendein Inhalt geschrieben ist: wie breit die Seite wird, wie sie sich auf kleinen Bildschirmen umbaut und wo Abstände herkommen.
Bootstrap löst das mit zwei Bausteinen. Der Container legt die maximale Breite und den Außenabstand fest – in mehreren Varianten, von einer festen Breite bis zur vollen Fensterbreite. Das Grid teilt den Platz darin in Zeilen und Spalten auf, immer auf Basis von zwölf Einheiten.
In t3sbootstrap sind beide als Content-Elemente verfügbar. Der Container lässt sich global für die ganze Installation, pro Seitenbaum und pro Element setzen; die feinere Ebene gewinnt. Das Grid wird pro Breakpoint eingestellt: du legst fest, wie viele der zwölf Einheiten eine Spalte ab welcher Bildschirmbreite einnimmt.
Die Abstände zwischen den Spalten kommen über die Gutter-Optionen, nicht über eigenes CSS. Wer sich daran hält, kommt bei den meisten Projekten ohne eine einzige eigene Media Query aus.