Question

正如您在本网站上所推荐的那样，我使用嵌套表格来表示我的电子邮件模板和简报。但是，我对垂直对齐有问题。

...代码

…
<td align="center" height="30px" valign="middle" >
  <p style="font-family: Verdana; font-size: 16px;" align="center">
    Here is the text
  </p>
</td>
…

现在解释......

当我在我的电子邮件客户端（Thunderbird）上看到它时，我没有遇到任何问题。

当我在Android手机上的Outlook应用程序中看到它时，我也没有问题。

但是，当我通过live.com的网络邮件看到它时，它尊重TD的高度，而不是valign属性。

我的问题......是否存在垂直对齐这些内容的通用方法？如果我在WEB上工作，我知道几个，但是，因为所有人都推荐TABLES用于电子邮件模板，所以我被困了。

有什么建议吗？

非常感谢。

解决：

更改<p> <span>并使用valign （因为vertical-align：middle在所有平台中都不起作用）我在应用上看到相同的内容，实时网络邮件和雷鸟。

Answer 1

构建3行

<tr>
<td height="10">&nbsp;</td>
</tr>
<tr>
<td>Your content here</td>
</tr>
<tr>
<td height="10">&nbsp;</td>
</tr>

可能需要使用一些line-height和mso-line-height-rule：在那里确切等等以使其保持一致，但是应该强制中间垂直对齐穿过所有客户端。

Answer 2

为什么不使用尝试在样式中使用vertical-align？它对我有用。

<td align="center" height="30px" style="vertical-align:middle; " >
  <p style="font-family: Verdana; font-size: 16px;line-height:30px;" >
    Here is the text
  </p>
</td>

我改变了风格。我认为这里不需要p标签：

<td align="center" height="30px" style="vertical-align:middle;font-family: Verdana; font-size: 16px;line-height:30px; " >      
    Here is the text
</td>

在电子邮件模板或简报上对TD进行垂直对齐

2 个答案: