图像被截断 Outlook 2007/2010/2013

Question

我正在构建一个响应式 HTML 电子邮件模板，当我在 Litmus 测试我的布局时，图像在顶部被截断，如下所示...

有什么原因吗？这是一些代码，带有jsfiddle

<table style="color: #4b4b4b; font-size:12px; font-family: arial, helvetica, sans-serif; line-height: 18px; mso-line-height-rule: exactly; " >
<tbody>
<tr>
  <td height="40" width="40"><img src="http://www.uploadlibrary.com/TelecomsWorld/CALL-STATS/stats_07.jpg" width="40" height="40" style="display:block;" /></td>
<td>Geographic call mapping across the UK</td>
</tr>
...

我已经研究过了，找到了this answer，但是没有运气。

谢谢！

Answer 1

桌面上设置的line-height（可能还有mso-line-height-rule）导致Outlook 将图像向上推。

你真的需要吗？如果没有，我建议删除它。如果您需要它，请将其设置在包裹文本的 <td> 上，或者添加另一个表格以仅包裹文本并在那里设置行高。

更新：我编辑了您的代码 sn-p 以反映屏幕截图中显示的实际代码。

Answer 2

向已经是图像一部分的表格单元格添加相同的尺寸。

<td class="center" align="left" style="margin: 0;" height="32" width="540"><img src="http://www.uploadlibrary.com/TelecomsWorld/GENERAL/lowbluespeechedge.jpg" width="540" height="32" class="img_scale" style="display:block;" /></td>

还有：

您的业务是否已充分发挥潜力？

It's 表示it is。 “it”的所有格形式没有撇号。