Spaltenabstände in CMS-Blöcken anpassen

In dieser Anleitung erfährst du, wie du Spaltenabstände in CMS-Blöcken mit ThemeWare® CSS-Klassen anpassen kannst.

ThemeWare® stellt dir eine umfangreiche Auswahl an CSS-Klassen zu Verfügung mit welchen du die Spaltenabstände in CMS-Blöcken modifizieren kannst – also die Abstände zwischen zwei Spalten.

Tipp: Anwendungsbeispiele findest du in unseren Demoshops.


ThemeWare® CSS-Spaltenabstände

Die ThemeWare® CSS-Spaltenabstandsklasssen funktionieren für ThemeWare® Spalten und Grid CMS-Blöcke sowie die meisten Standard CMS-Blöcke von Shopware.

In den ThemeWare® Grid-Blöcken definieren die Klassen auch den Abstand von zwei Elementen, die in einer Spalten übereinander liegen.

CSS-Klassen

KlasseBereichFunktionsbeschreibung

twt-cms-col-padding-0

Block

Setzt den Innenabstand für Spalten in CMS-Blöcken auf 0 Pixel.

twt-cms-col-padding-5

Block

Setzt den Innenabstand für Spalten in CMS-Blöcken auf 5 Pixel.

twt-cms-col-padding-10

Block

Setzt den Innenabstand für Spalten in CMS-Blöcken auf 10 Pixel.

twt-cms-col-padding-15

Block

Setzt den Innenabstand für Spalten in CMS-Blöcken auf 15 Pixel.

-

-

20 Pixel ist der Standard Spalten-Abstand.

twt-cms-col-padding-25

Block

Setzt den Innenabstand für Spalten in CMS-Blöcken auf 25 Pixel.

twt-cms-col-padding-30

Block

Setzt den Innenabstand für Spalten in CMS-Blöcken auf 30 Pixel.

twt-cms-col-padding-35

Block

Setzt den Innenabstand für Spalten in CMS-Blöcken auf 35 Pixel. [ab Version 1.0.12]

twt-cms-col-padding-40

Block

Setzt den Innenabstand für Spalten in CMS-Blöcken auf 40 Pixel. [ab Version 1.0.12]

Hinweis: Wie du die CSS-Klassen einfügst erfährst du im Artikel ThemeWare® CSS-Klassen für Erlebniswelten.

Beispiel

Hinweis: Du kannst die ThemeWare® "CSS-Klassen für Spaltenabstände" je nach Bedarf aktivieren bzw. deaktivieren. Die Konfiguration findest du im Tab "Weiteres" => Bereich "Erweiterte Einstellungen" => Abschnitt "Zusätzliche CSS-Klassen".


Mobile Darstellung

Mit ThemeWare® 2.1 folgen Klassen für die Abstände in mobilen Viewports – also für die Abstände von Spalten die untereinander dargestellt werden.

CSS-Klassen

KlasseBereichFunktionsbeschreibung

-

-

0 Pixel ist der Standard Spalten-Abstand.

twt-cms-col-margin-5

Block

Setzt den "Abstand nach unten" für Spalten in CMS-Blöcken auf 5 Pixel.

twt-cms-col-margin-10

Block

Setzt den "Abstand nach unten" für Spalten in CMS-Blöcken auf 10 Pixel.

twt-cms-col-margin-15

Block

Setzt den "Abstand nach unten" für Spalten in CMS-Blöcken auf 15 Pixel.

twt-cms-col-margin-20

Block

Setzt den "Abstand nach unten" für Spalten in CMS-Blöcken auf 20 Pixel.

twt-cms-col-margin-25

Block

Setzt den "Abstand nach unten" für Spalten in CMS-Blöcken auf 25 Pixel.

twt-cms-col-margin-30

Block

Setzt den "Abstand nach unten" für Spalten in CMS-Blöcken auf 30 Pixel.

twt-cms-col-margin-35

Block

Setzt den "Abstand nach unten" für Spalten in CMS-Blöcken auf 35 Pixel.

twt-cms-col-margin-40

Block

Setzt den "Abstand nach unten" für Spalten in CMS-Blöcken auf 40 Pixel.

twt-cms-col-margin-45

Block

Setzt den "Abstand nach unten" für Spalten in CMS-Blöcken auf 45 Pixel.

twt-cms-col-margin-50

Block

Setzt den "Abstand nach unten" für Spalten in CMS-Blöcken auf 50 Pixel.

twt-cms-col-margin-55

Block

Setzt den "Abstand nach unten" für Spalten in CMS-Blöcken auf 55 Pixel.

twt-cms-col-margin-60

Block

Setzt den "Abstand nach unten" für Spalten in CMS-Blöcken auf 60 Pixel.

twt-cms-col-margin-65

Block

Setzt den "Abstand nach unten" für Spalten in CMS-Blöcken auf 65 Pixel.

twt-cms-col-margin-70

Block

Setzt den "Abstand nach unten" für Spalten in CMS-Blöcken auf 70 Pixel.

twt-cms-col-margin-75

Block

Setzt den "Abstand nach unten" für Spalten in CMS-Blöcken auf 75 Pixel.

twt-cms-col-margin-80

Block

Setzt den "Abstand nach unten" für Spalten in CMS-Blöcken auf 80 Pixel.

Beispiele

Last updated

Logo

© 2024 by ThemeWare® | Made with 💙 by TC-Innovations GmbH