Question

所以，我试图用桌子制作一个电子邮件模板。

我在body标签下面有下表

  <table style="padding-top:0px; max-width: 650px;" border="0" cellspacing="0" cellpadding="0" align="center" bgcolor="#ffffff">
<tbody>
  <tr>
    <td  height="10" style="width: 650px;">
      <table width="100%" border="0" cellspacing="0" cellpadding="0">
        <tbody width="100%">
          <tr width="100%">
            <td width="2.5%">&nbsp;</td>
            <td width="22%" style="font-family: Arial, Helvetica, sans-serif; font-size: 10pt; font-weight: bold;">AAAA AAAA</td>
            <td width="40%" style="text-indent: 4%; font-family: Arial, Helvetica, sans-serif; font-size: 10pt; font-weight: bold;">BBBB</td>
            <td width="22%" align="center" style="font-family: Arial, Helvetica, sans-serif; font-size: 10pt; font-weight: bold;">CCC</td>
            <td width="13%" style="text-indent: 4.5%; font-family: Arial, Helvetica, sans-serif; font-size: 10pt; font-weight: bold;">DDDDD</td>
          </tr>
        </tbody>
      </table>
    </td>
  </tr>
</tbody>

它看起来就像我想要的Outlook（桌面，移动人像，移动版）。它在桌面和移动环境中的gmail看起来很不错。

但是如果你在手机肖像的gmail中打开它，那么td的内容就会在左侧蜷缩起来。

任何人都知道为什么？如果重要，我会在Nexus 5手机上的gmail应用程序中进行测试。

Answer 1

试试这个：

<table width="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td width="25%" style="padding-left:3%; font-family: Arial, Helvetica, sans-serif; font-size: 10pt; font-weight: bold;">AAAA AAAA</td>
    <td width="40%" style="padding-left: 4.5%; font-family: Arial, Helvetica, sans-serif; font-size: 10pt; font-weight: bold;">BBBB</td>
    <td width="22%" align="center" style="font-family: Arial, Helvetica, sans-serif; font-size: 10pt; font-weight: bold;">CCC</td>
    <td width="13%" style="padding-left: 4.5%; font-family: Arial, Helvetica, sans-serif; font-size: 10pt; font-weight: bold;">DDDDD</td>
  </tr>
</table>

不确定text-indent是否有效，但填充确实有效。如果您想要最大宽度的流体布局，请将其包装在this fluid template example

中

gmail电子邮件模板：如何在纵向移动表格？

1 个答案: