html - outlook 2013 浏览器内收件箱正在向我的表格添加样式属性并破坏对齐

Question

编辑:我添加了一个 fiddle 来更好地展示正在发生的事情，因为花时间提供答案的人(谢谢!)似乎没有得到我的要求，所以希望这有助于澄清 http://jsfiddle.net/t5sPL/

我正在发送一封 HTML 电子邮件。它在 gmail、outlook 桌面客户端和其他几个电子邮件客户端中呈现良好。然而，在 outlook webmail 应用程序中在线查看收件箱时，http://portal.microsoftonline.com , Microsoft 似乎正在尽最大努力不让我将表格的内容居中。被这篇文章提示

https://litmus.com/blog/hotmail-and-outlook-com-drop-support-for-margin

我看到 margin不再支持属性。我尝试使用 padding相反，没有运气。所以，为了让我的 table 居中，我想我可以老派使用这个模式来居中:

<table width='100%' style='width:100%'>
    <tbody>
        <tr>
            <td align='center'>
                <table width='700' style='width:700px'>
                    <tbody>
                        <tr>
                            <td>Content to be centered</td>
                        </tr>
                    </tbody>
                </table>
            </td>
        </tr>
    </tbody>
</table>

然而，这仍然不起作用，因为在我的<td align='center'>标记，outlook 莫名其妙地附加了一个 style='text-align:center;'属性，对于

的结果

<td align='center' style='text-align:center;'>

这有效地证明了左边的内容。当我使用“检查元素”并删除样式属性时，一切看起来都符合预期。

有没有人处理过这个问题？任何解决方案或解释？谢谢!

Answer 1

您是否试图将内容置于 700 宽的表格中？如果是这样，请添加 align="center"到它所在的表格单元格:

            <table width='700' style='width:700px'>
                <tbody>
                    <tr>
                        <td align="center">Content to be centered</td>
                    </tr>
                </tbody>
            </table>

如果您尝试左对齐 700 表格内容，但让 700 表格本身居中，只需添加 align="left"到 <td>相反。

更新:

基于您的 jsFiddle - 这应该可以修复它:

<table width='100%' style='width:100%' border=1>
<tbody>
    <tr>
        <td align='center' style='text-align:center'>
            <table align='center' width='700' style='width:700px' border=1>
                <tbody>
                    <tr>
                        <td align='left'><b style='color:red'>This content used to be aligned incorrectly...</b></td>
                    </tr>
                </tbody>
            </table>
        </td>
    </tr>
</tbody>