如何为 Zurb Ink 电子邮件内容添加最小边距？答案

【问题标题】：How to add minimum margin to Zurb Ink email content?如何为 Zurb Ink 电子邮件内容添加最小边距？
【发布时间】：2014-08-13 11:38:26
【问题描述】：

这是我刚刚创建的 Plunker：http://plnkr.co/edit/jKo6yavo9fFNHiMsEvAL?p=preview

这是一个简单的单行布局。我需要的是行两侧（左右）的固定最小边距。假设是 25 像素。调整窗口大小应始终在行前后显示至少 25 像素的灰色背景。

我尝试从以下位置修改table.container 样式：

table.container {
    width: 580px;
    margin: 0 auto;
    text-align: inherit;
}

到

table.container {
    width: 580px;
    margin: 0 25px 0 25px;
    text-align: inherit;
}

但它似乎不适用于右边距（超出页面）。有什么建议吗？

【问题讨论】：

标签： margin zurb-ink

【解决方案1】：

我认为最简单的解决方案是使用左右表格边框而不是边距。

下面的 CSS 应该可以解决问题。

table.container {
    width: 580px;
    border-left: solid 25px #f1f0ef !important;
    border-right: solid 25px #f1f0ef !important;
    text-align: inherit;
}

由于并非所有电子邮件客户端都支持边距，您的另一个选择是向外部表格/表格添加填充/边框。

如果您有任何问题，请告诉我。

【讨论】：