在此页面上：了解如何在Email Designer中调整列和结构的垂直对齐和填充，包括如何修复剩余片段填充以便正确进行移动渲染。
在本例中，我们将调整由三列组成的结构组件内的填充和垂直对齐。
-
直接在电子邮件中或使用左侧菜单中提供的 导航树 选择结构组件。
-
在工具栏中，单击选择一个列，然后选择要编辑的列。 也可以从结构树中选择它。
该列的可编辑参数显示在 样式 选项卡中。
-
在 对齐方式 下，选择顶部、中间或底部。
-
在 填充 下，定义所有边的填充。
如果要微调边距，请选择每边不同的边距。 单击锁定图标可中断同步。
-
以类似的方式继续调整其他列的对齐方式和内边距。
-
保存更改。
使用痕迹导航管理片段填充 fragment-padding-breadcrumb
在Email Designer中使用片段时，您可能会遇到隐藏或残余填充，这些填充对移动设备渲染的影响与对桌面设备的影响不同。 当片段已解锁或继承已中断时，这种情况尤其常见，因为剩余样式可以保留在基础列或文本组件中。
要识别和编辑片段中的剩余边距，请执行以下操作：
-
使用 导航树 或直接单击编辑器中的元素以选择片段中的每个父结构或列。 这有助于您找到特定于移动设备的隐藏边距或边距。
-
在痕迹导航中选择元素后，导航到右侧的 样式 选项卡。
-
查看 内边距 设置，并根据需要删除或重新调整内边距，以实现正确的移动设备对齐方式。
-
如果在重用片段时仍然存在对齐问题，请对片段中的其他列或文本组件重复此过程。
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.