HTML 电子邮件 - Outlook.com 无法识别我的图像垂直对齐控件答案

【问题标题】：HTML Email - Outlook.com won't recognise my vertical align control for an imageHTML 电子邮件 - Outlook.com 无法识别我的图像垂直对齐控件
【发布时间】：2013-04-19 09:32:29
【问题描述】：

我在 2 单元格行的单元格 1 中有一个图像。单元格 2 中有文本。因为 Outlook.com 决定在文本之间提供额外的间距（与其他浏览器相比），它会扭曲（增加高度）整行：但单元格 1 中的图像保持与单元格顶部对齐.

我试过强制文本的行高，但这不起作用。

目前我的代码是：

<td style="vertical-align: middle;" valign="middle">
<p style="text-align: center;">
<img style="margin: 0 auto; vertical-align: middle;" valign="middle" title="Date and Venue" alt="Date and Venue" src="imgURL" height="x" width="y">
</p>
</td>

但所有这些说明都被 Outlook.com 忽略了。

如何使图像在单元格中居中？

【问题讨论】：

标签： outlook html-email outlook.com

【解决方案1】：

图像应始终在电子邮件中包含display:block;。您不需要任何边距或 css 对齐的东西。这是一个基本的例子：

<table width="100" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td width="100" height="100" align="center" valign="middle" bgcolor="#cccccc">

<img style="margin: 0; border: 0; padding: 0; display: block;" src="" width="50" height="50" alt="">

    </td>
  </tr>
</table>

【讨论】：

谢谢，你拯救了我的一天 :-)