Grid

Das Theme basiert auf Spectre CSS, womit Sie u. a. Elemente ganz einfach nebeneinander und gleichzeitig für mobile Geräte in einer Spalte darstellen können.

Platzieren des Inhaltscontainers

Um beispielsweise zwei Textelemente nebeneinander darzustellen, fügen Sie zuerst jeweils ein Element vom Typ Contao Themes (Inhaltscontainer Anfang) und Contao Themes (Inhaltscontainer Ende) hinzu.

Inhaltscontainer platzieren

Das Element vom Typ Inhaltscontainer Anfang muss unter Erweiterte CSS-Klassen das Col-Attribut .columns bekommen.

Col-Attribut columns hinzufügen

Platzieren der Inhaltselemente

Zwischen den Umschlagselementen platzieren Sie die Elemente, die Sie nebeneinander darstellen möchten. Dabei müssen Sie unter Erweiterte CSS-Klassen das Col-Attribut .column auswählen.

column Klasse hinzufügen

Zusätzlich können Sie auch noch weitere Klassen definieren, u. a. Spaltenbreiten für bestimmte Auflösungen oder
Spalten-Abstände. Weitere Informationen finden Sie in der Spectre-Dokumentation unter Flexbox-Grid und Responsive.

Grid Klassen

Beispiel

Grid Beispiel