雅虎！邮件 HTML 电子邮件对齐问题答案

【问题标题】：Yahoo! Mail HTML Email Alignment Issue雅虎！邮件 HTML 电子邮件对齐问题
【发布时间】：2014-05-15 11:50:44
【问题描述】：

我每天都在构建 HTML 电子邮件活动，在过去的 24 小时内，我看到我的所有电子邮件都向左对齐。这包括我之前构建的电子邮件活动（在 Yahoo! Mail 中测试并用于对齐中心）。

还有其他人遇到过这个吗？任何想法是什么导致它以及是否可以添加修复？

使用的标准编码是居中对齐的表格。这现在不起作用，所有表格似乎都向左对齐。

【问题讨论】：

【解决方案1】：

我已经找到了解决方案。

在最外层 100% 宽度且居中对齐的表格上添加以下代码：

style="table-layout: fixed;"

这应该可以解决它。

【讨论】：

【解决方案2】：

在电子邮件头部的样式块中添加一个类。

.table-center { table-layout: fixed; margin: 0 auto; }

将这个类添加到最外面的表格中，使主体在窗口中居中。然后根据需要将其添加到后代表中以进行居中对齐。

【讨论】：

【解决方案3】：

我尝试了提供的两种解决方案，但都无法解决问题。我相信还有一个更大的问题——雅虎！ mail 将电子邮件包装在几个 div 标签中，其中一个带有“body”类。此 div 的宽度值为“auto”。

当我通过 Chrome 开发人员工具将此值从“自动”更改为“100%”时，它可以解决问题。

未修改：

“固定”：

因为这个 div 超出了我在电子邮件标题中的样式块的范围，我不相信这个问题实际上可以得到解决。我会将此归类为雅虎的错误。

【讨论】：

嗨，Istanard，确保在整个电子邮件的外部包裹一个 100% 宽度的表格，其中有一个您希望电子邮件宽度的“内容”表格（最佳做法是 640 或600 像素）。在外部表中包含 style="table-layout: fixed; margin: 0 auto; - 在最外层的 TD 中也包含 align="center" 标记。

【解决方案4】：

我在这里支持 Ed Johnson 关于“固定；边距：0 自动；”的回答。外面的桌子上的风格。我只是使用此修复而不是“表格布局：固定”样式，因为后者似乎破坏了我的响应式电子邮件样式。

【讨论】：