为 HTML 电子邮件指定表格的 TD 宽度 - 包括 jsfiddle - Specifying table's TD width for HTML email- jsfiddle included 小贝子编程网

我正在尝试创建一个HTML电子邮件的布局。我已经很久没有和桌子打交道了，我需要复习一下。

我试图创建一个表，其中每个TD是总宽度的50%:

<body style="padding-top:20px;">
    <table style="padding:20px;border:1px solid #f0f0f0;background:#FFFFFF;text-align:left;clear:both;margin:0 auto;display:block;width:85%;max-width:600px;table-layout:fixed;">
        <tr style="">
            <td style="width:50%;border:1px solid #ff0000;">left</td>
            <td style="width:50%;">right</td>
        </tr>
    </table>
</body>

文件如下:

http://jsfiddle.net/8br3wpL8/

任何帮助将非常感激!

您需要从表样式中删除display: block:

<table style="padding:20px;border:1px solid #f0f0f0;background:#FFFFFF;text-align:left;clear:both;margin:0 auto;width:85%;max-width:600px;table-layout:fixed;">
    <tr style="">
        <td style="width:50%;border:1px solid #ff0000;">left</td>
        <td style="width:50%;">right</td>
    </tr>
</table>

http://jsfiddle.net/8br3wpL8/1/

如果您删除display:block;部分，一切工作

<table style="padding:20px;border:1px solid #f0f0f0;background:#FFFFFF;text-align:left;clear:both;margin:0 auto;width:85%;max-width:600px;table-layout:fixed;">
    <tr style="">
        <td style="width:50%;border:1px solid #ff0000;">left</td>
        <td style="width:50%;">right</td>
    </tr>
</table>

为 HTML 电子邮件指定表格的 TD 宽度 - 包括 jsfiddle

相关内容

最新更新

热门标签：