「ポラロイド」スタイルの境界線とキャプションで囲まれた画像を特徴とするメールを作成しました。そのために、白い背景の画像の周りにテーブルを作成しました。Outlook 2007 と 2010 を除いてすべて正常に動作します。これがどのように見えるか (Outlook 2011 バージョン) です。
2010 年 7 月の表示方法は次のとおりです。表をページの幅から押し出し、表の幅を大幅に広げています。
これが私が使用したコードです-テーブルは問題を引き起こす唯一の要素です:
<table border="0" cellpadding="0" cellspacing="0" width="100%" class="mcnImageBlock" style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
<tbody class="mcnImageBlockOuter">
<tr>
<td valign="top" style="padding: 9px;border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;" class="mcnImageBlockInner">
<table align="left" width="100%" border="0" cellpadding="0" cellspacing="0" class="mcnImageContentContainer" style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
<tbody>
<tr>
<td class="mcnImageContent" valign="top" style="width:164px;background-color:white;padding-right: 9px;padding-left: 9px;padding-top: 9px;padding-bottom:9px;border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
<table>
<tr>
<td style="max-width:160px;border: 1px solid #b3b3b3;">
<img mc:edit="product 1" class="mcnImage" width="100%" style="max-width:160px;">
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top" mc:edit="Caption 1" class="mcnTextContent" style="padding-top: 9px;padding-right: 18px;padding-bottom: 9px;padding-left: 18px;border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;background-color:white;font-family: Helvetica;font-size: 11px;line-height: 150%;text-align: left;">
<center> </center>
</td>
</tr>
<tr>
<td valign="top" style="padding-top: 0;padding-right: 0;padding-bottom: 0;padding-left: 0;border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;background-color:white;text-align: left;">
<img align="center" height="18" src="http://gallery.mailchimp.com/004beaebbdbc9392458d4bde2/images/shadow.1.gif" style="height: 18px;width:100%;">
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>