Outlook 2013の試用版では、HTMLメールの画像が非常に奇妙に表示されています。テストで把握できる限り、高さが20ピクセルより短い画像には、高さが20ピクセルになるようにパディングが追加されているようです。それを変えるために私にできることはありますか?これらの電子メールは、Outlook 2010や、私がテストしている他のすべての場所で問題なく表示されます。
それらが含まれているテーブルセルの高さを変更してみました(through height="13"
およびインラインcss)、およびそれらが含まれるテーブルとテーブル行は、すべて役に立ちません。次のコードは、画像の上のセルの赤い背景を見ることができるという点で、この問題を引き起こすものの簡単な例です。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="195" style="background-color:#ff0000;"><img src="image url here" alt="" width="195" height="13" style="display: block" /></td>
</tr>
</table>
</body>
</html>
誰か助けてもらえますか?
line-height
スタイルをtd
タグに追加します(そして、適切な方法として、height
属性もtd
タグに追加します)。
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="195" height="13" style="background-color:#ff0000; line-height:13px;">
<img src="..." alt="" width="195" height="13" style="display:block;" />
</td>
</tr>
</table>
変更されたコードは、OutlookのすべてのバージョンのLitmusで正常にテストされました。
セルパディングを削除すると、赤いbgは表示されません。
<font size="1"><img /></font>
を追加しても、問題を解決できることがわかりました。