Mit nachfolgenden Klassen kannst du Dimensionen und Animationen für deine Content-Blöcke steuern. Dazu klickst du auf das jeweilige Element, bis die sechs kleinen Punkte sichtbar sind und scrollst dann in der rechten Spalte nach unten bis zum Erweitert-Bereich.
Dimensionen
Mit folgender Angabe lassen sich mehrspaltige Inhalte auf die Breite einspaltiger Inhalte reduzieren/ vergrößern, sofern für diese eine andere Breite unter Design > Customizer > Allgemein definiert wurde (wenn die Breite für einspaltige Inhalte kleiner ist als die maximale Seitenbreite).
dl-singlewidth
Seitenbreite
dl-columnwidth
Innere Header- und Footer-Breite
dl-fullwidth
Mobile Hacks
Um auf geringen Auflösungen die Schriftgrößen responsiv der Bildschirmbreite anzupassen, empfehle ich dir in den Grundeinstellungen des Design-Customizers die Option „Automatisch optimierte Schriftgrößen bei mobiler Auflösung“ zu aktivieren.
Über die Row-Elemente des Kadence-Blocks lassen sich übrigens individuelle Abstände auf mobiler Auflösung definieren.
Mit den folgenden Klassen kannst du Elemente auf mobiler Auflösung komplett entfernen (die Inhalte werden dann also nicht geladen) oder auf Desktop-Geräten ausblenden:
dl-nomobile
dl-nodesktop
Es ist auch möglich nur die Hintergrundbilder mobil auszublenden.
dl-nomobilebackground
Sonstige Elemente
Listen
Markierst du eine Liste mit der folgenden Klasse, können entweder nur die Punkte ausgeblendet werden oder die Listenpunkte auf Desktop-Auflösung nebeneinander dargestellt werden („inline“). Beispiel: Schnellnavigation
dl-nolist
dl-listinline
Tabellen
Mit folgender Klasse lassen sich Tabellen kennzeichnen, bei denen die dritte Spalte (der am häufigsten genutzte Preis) mit einem Rahmen hervorgehoben wird. Beispiel: Preistabelle
dl-pricechart
Gravity Forms
Formularfelder lassen sich zwei- oder dreispaltig darstellen. Wir empfehlen übrigens in den Gravity Forms-Einstellungen das CSS zu deaktivieren.
dl-halfcolumn
dl-thirdcolumn
Animationen
Du kannst für jeden Content Block über den Reiter „Animations“ einen individuellen Einblende-Effekt definieren.