html - 在Gmail中将HTML电子邮件的正文居中

我正在重新生活基于表的布局的辉煌时光，因为我正在编写HTML电子邮件。不幸的是，我无法使正文位于页面的中心（当然，它可以在浏览器中使用，但是在通过HTML Mails在Gmail中进行测试时则不能。）我希望嵌套在第一个<td>中的表格位于外部表的中心。内部表设置为固定宽度，因此我希望它能起作用。

这是完整的代码（fiddle）：

<table width="100%">
<tr>
    <td width="100%" align="center">
        <table width="600" height="100%">
            <tr>
                <td width="100%">
                    <table cellpadding="0" cellspacing="0">
                        <tr>
                            <td>
                                <table cellpadding="0" cellspacing="0">
                                    <tr>
                                        <td style="border-top: 1px solid #DFC6B2; border-bottom: 1px solid #DFC6B2;">
                                            <table cellpadding="0" cellspacing="0">
                                                <tr>
                                                    <td width="250" height="40" style="border-top: 1px solid #E30023; border-bottom: 1px solid #E30023;"></td>
                                                </tr>
                                            </table>
                                        </td>
                                    </tr>
                                </table>
                            </td>
                            <td>
                                <table cellpadding="0" cellspacing="0">
                                    <tr>
                                        <td width="100" height="100">
                                            <img src="" width="100" height="100">
                                            </a>
                                        </td>
                                    </tr>
                                </table>
                            </td>
                            <td>
                                <table cellpadding="0" cellspacing="0">
                                    <tr>
                                        <td style="border-top: 1px solid #DFC6B2; border-bottom: 1px solid #DFC6B2;">
                                            <table cellpadding="0" cellspacing="0">
                                                <tr>
                                                    <td width="250" height="40" style="border-top: 1px solid #E30023; border-bottom: 1px solid #E30023;"></td>
                                                </tr>
                                            </table>
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                    </table>
                    <table cellpadding="20">
                        <tr>
                            <td width="100%" style="font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:13px;">
                                 <h1 align="left" style="font-weight:100;margin-top:20px;">Header</h1>

                                <p style="font-family: Georgia, serif;">Body</p>
                            </td>
                        </tr>
                    </table>
                    <table width="100%" cellpadding="0" cellspacing="0">
                        <tr>
                            <td>
                                <table cellpadding="0" cellspacing="0">
                                    <tr>
                                        <td width="275" height="1" style="border-top: 1px solid #DFC6B2;"></td>
                                    </tr>
                                </table>
                            </td>
                            <td>
                                <table cellpadding="0" cellspacing="0">
                                    <tr>
                                        <td width="50" height="50">
                                            <img src="" width="50" height="50" />
                                        </td>
                                    </tr>
                                </table>
                            </td>
                            <td>
                                <table cellpadding="0" cellspacing="0">
                                    <tr>
                                        <td width="275" height="1" style="border-top: 1px solid #DFC6B2;"></td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
    </td>
</tr>

最佳答案

当我检查Litmus时，您的代码工作正常。
我唯一关心的是，您可能需要在以下内容中添加“ text-align：left”，以使副本在Gmail / IE上与左侧对齐。

<p style="font-family: Georgia, serif; text-align: left;">Body</p>