Auf dieser Seite Erfahren Sie, wie Sie die senkrechte Ausrichtung und den Abstand von Spalten und Strukturen in der E-Mail-Designer anpassen, einschließlich der Behebung des restlichen Fragmentabstands für das korrekte Rendering auf Mobilgeräten.
In diesem Beispiel passen wir den Abstand und die senkrechte Ausrichtung innerhalb einer Strukturkomponente an, die aus drei Spalten besteht.
-
Wählen Sie eine Strukturkomponente direkt in der E-Mail oder über den Navigationsbaum im linken Menü aus.
-
Wählen Sie in der Symbolleiste mit der Option Spalte auswählen die gewünschte Spalte aus. Sie können sie auch im Strukturbaum auswählen.
Die bearbeitbaren Parameter für diese Spalte werden im Menü Stile angezeigt.
-
Wählen Sie unter Ausrichtung die Option Oben, Zentriert oder Unten aus.
-
Legen Sie unter Abstand den Abstand für alle Seiten fest.
Wählen Sie Unterschiedliche Abstände für jede Seite aus, wenn Sie eine Feinabstimmung für den Abstand vornehmen möchten. Klicken Sie auf das Sperrsymbol, um die Synchronisierung aufzuheben.
-
Gehen Sie analog mit den anderen Ausrichtungs- und Abstandseinstellungen der Spalten vor.
-
Speichern Sie Ihre Änderungen.
Verwalten der Abstände von Fragmenten mit Breadcrumb-Navigation fragment-padding-breadcrumb
Beim Arbeiten mit Fragmenten im E-Mail-Designer kann es vorkommen, dass der ausgeblendete oder verbleibende Abstand das Rendering auf Mobilgeräten anders beeinflusst als auf dem Desktop. Dies geschieht besonders häufig, wenn Fragmente entsperrt wurden oder die Vererbung unterbrochen wurde, da übrig gebliebene Formatierungen in den zugrunde liegenden Spalten- oder Textkomponenten verbleiben können.
So identifizieren und bearbeiten Sie verbleibende Abstände in Fragmenten:
-
Verwenden Sie den Navigationsbaum oder klicken Sie direkt auf Elemente im Editor, um jede übergeordnete Struktur oder Spalte innerhalb Ihres Fragments auszuwählen. Auf diese Weise können Sie ausgeblendete Abstände oder Ränder finden, die speziell für Mobilgeräte gelten.
-
Nachdem Sie das Element im Breadcrumb ausgewählt haben, navigieren Sie auf der rechten Seite zur Registerkarte Stile.
-
Überprüfen Sie die Einstellungen für Abstände und entfernen Sie die Abstände nach Bedarf oder passen Sie sie an, um eine korrekte Ausrichtung auf Mobilgeräten zu erreichen.
-
Wenn bei der Wiederverwendung von Fragmenten weiterhin Ausrichtungsprobleme auftreten, wiederholen Sie diesen Vorgang für andere Spalten oder Textkomponenten innerhalb des Fragments.
This section contains structured knowledge intended to support interpretation, retrieval, and question answering related to this topic.
For complete understanding, this information should be combined with the documentation on this page. Neither source is intended to stand alone; the page describes the feature, while this section provides additional context that helps disambiguate terminology, intent, applicability, and constraints.
- TL;DR: This page explains how to adjust the vertical alignment and padding of columns in a structure component in the Email Designer, and how to locate and fix residual fragment padding for correct mobile rendering using breadcrumb navigation.
Intents:
- Adjust vertical alignment (Top, Middle, Bottom) of a column in a structure component
- Set padding for all sides, or different padding per side, of a column
- Fine-tune padding by breaking synchronization with the lock icon
- Identify and remove hidden or residual fragment padding affecting mobile rendering
Glossary:
- Alignment: A Styles-tab setting for a column, with options Top, Middle, or Bottom (product-specific)
- Padding: A Styles-tab setting defining padding for all sides of a column, with an option for Different padding for each side (product-specific)
- Navigation tree: The left-hand menu used to select a structure component or column (product-specific)
- Breadcrumb navigation: Used to select each parent structure or column within a fragment to locate hidden padding or margin specific to mobile devices (product-specific)
Guardrails:
- Residual or hidden fragment padding is particularly common when fragments have been unlocked or when inheritance has been broken, as leftover styling can remain in the underlying column or text components.
- Accumulated styling from repeatedly inserting and removing fragments is expected behavior; verify padding values using breadcrumb navigation, especially when targeting mobile devices.
- For Gmail on Android, use column padding rather than large fixed margins, and use a smaller image width, because Gmail on Android often renders oversized images and margins incorrectly.
Terminology:
- Canonical name: Vertical alignment and padding — Acronym: n/a — variants: alignment and padding, column padding
- Synonyms: “Different padding for each side” = “fine tune the padding”
- Do not confuse: “Alignment” (Top/Middle/Bottom vertical positioning) ≠ “Padding” (space on the sides of a column)
FAQ:
- Q: What vertical alignment options are available for a column? — Top, Middle, or Bottom.
- Q: How do I set different padding on each side of a column? — Select Different padding for each side and click the lock icon to break synchronization.
- Q: Why does my fragment have extra padding on mobile but not desktop? — Leftover styling can remain when fragments are unlocked or inheritance is broken; use the Navigation tree or breadcrumb to select parent structures/columns and remove or readjust the padding.
- Q: How should I handle images and dividers for Gmail on Android? — Use column padding rather than large fixed margins and a smaller image width, since Gmail on Android often renders oversized images and margins incorrectly.