HTML メール テンプレートを作成しました。このテンプレートは、Outlook 2007/2010 を除くすべての市長メール クライアント (gmail、thunderbird など) でうまく機能します。Outlook 2003 では、メールが適切に表示されます。
これは正しいレイアウトです。オレンジ色のヘッダー バーが正しい位置に表示されます。
これが Outlook 2007/2010 の問題点です。ヘッダー バーは本文の外側、メールの上にあります。
ここに私のテンプレートがあります：
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>Wieskamp Nieuwsbrief</title>
<style type="text/css">
body,td{font-family: Verdana, Arial; font-size: 12px;color: black;}
.header{font-size:12px;font-weight:bold;color: #f4f4be;text-align:center;}
v:* { behavior: url(#default#VML); display: inline-block; }
</style>
</head>
<body style="margin: 0">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center">
<table border="0" cellpadding="0" cellspacing="0" width="600">
<tr>
<td background="http://www.wieskamp.nl/media/nieuwsbrief/wieskamp-nieuwsbrief-header.jpg" bgcolor="#f6f6f6" width="600" height="226" valign="top">
<!--[if gte mso 9]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:600px;height:226px;">
<v:fill type="tile" src="http://www.wieskamp.nl/media/nieuwsbrief/wieskamp-nieuwsbrief-header.jpg" color="#f6f6f6" size="600px,226px"/>
<v:textbox inset="0,0,0,0">
<![endif]-->
<div>
</div>
<!--[if gte mso 9]>
</v:textbox>
</v:rect>
<![endif]-->
</td>
</tr>
<tr>
<td background="http://www.wieskamp.nl/media/nieuwsbrief/wieskamp-nieuwsbrief-midden.jpg" bgcolor="#cfd300" width="600" valign="top" style="background-repeat: repeat-y no-repeat;">
<!--[if gte mso 9]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:600px;">
<v:fill type="tile" src="http://www.wieskamp.nl/media/nieuwsbrief/wieskamp-nieuwsbrief-midden.jpg" color="#f4f4be" size="600px,6px" />
<v:textbox style="mso-fit-shape-to-text:true" inset="0,0,0,0">
<![endif]-->
<div>
<table border="0" cellpadding="0" cellspacing="0" width="600">
<tr>
<td width="40"></td>
<td colspan="3" align="center" background="http://www.wieskamp.nl/media/nieuwsbrief/header_balk.jpg" bgcolor="#cfd300" width="520" height="26" valign="top" style="color: #f4f4be;font-weight: bold;vertical-align: middle;background-repeat: repeat-y no-repeat;">
<!--[if gte mso 9]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:520px;height:26px;">
<v:fill type="tile" src="http://www.wieskamp.nl/media/nieuwsbrief/header_balk.jpg" color="#f6f6f6" size="520px,26px"/>
<v:textbox inset="0,0,0,0">
<![endif]-->
<div>
Headerbalk
</div>
<!--[if gte mso 9]>
</v:textbox>
</v:rect>
<![endif]-->
</td>
<td width="40"></td>
</tr>
<tr><td colspan="6"> </td></tr>
<tr>
<td width="40"></td>
<td width="10"></td>
<td width="124" valign="top"><img src="http://www.wieskamp.nl/media/nieuwsbrief/plaatjes.jpg" width="114" height="160"/></td>
<td width="386" valign="top">
<b>Er gaat iets gebeuren</b><br><br>
22 februari 2013<br><br>
De bomen worden weer fris groen, de bloeitijd begint. De lucht geurt van bloesem en het eerste gemaaide gras. De vogels geven hun concert bij de opgaande zon. De lente is een uitstekend jaargetijde om op vakantie te gaan in het Nationale Landschap Winterswijk.
De lente loopt van maart tot en met juni op Camping Het Wieskamp. Natuurlijk is er met Pasen, Hemelvaart en Pinksteren veel te beleven op het terrein. Maar daarom heen vindt u de rust op de standplaats, en ook erbuiten. Al wandelend of fietsend ontdekt u de nestelende vogels. de bloeiende hoogstamfruitbomen en het frisse groen van de omliggende natuurgebieden.
</td>
<td width="40"></td>
</tr>
<tr><td colspan="6"> </td></tr>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="600">
<tr>
<td width="40"></td>
<td colspan="3" align="center" background="http://www.wieskamp.nl/media/nieuwsbrief/header_balk.jpg" bgcolor="#cfd300" width="520" height="26" valign="top" style="color: #f4f4be;font-weight: bold;vertical-align: middle;background-repeat: repeat-y no-repeat;">
<!--[if gte mso 9]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:520px;height:26px;">
<v:fill type="tile" src="http://www.wieskamp.nl/media/nieuwsbrief/header_balk.jpg" color="#f6f6f6" size="520px,26px"/>
<v:textbox inset="0,0,0,0">
<![endif]-->
<div>
Headerbalk
</div>
<!--[if gte mso 9]>
</v:textbox>
</v:rect>
<![endif]-->
</td>
<td width="40"></td>
</tr>
<tr><td colspan="6"> </td></tr>
<tr>
<td width="40"></td>
<td width="10"></td>
<td width="124" valign="top"><img src="http://www.wieskamp.nl/media/nieuwsbrief/plaatjes.jpg" width="114" height="160"/></td>
<td width="386" valign="top">
<b>Er gaat iets gebeuren</b><br><br>
22 februari 2013<br><br>
De bomen worden weer fris groen, de bloeitijd begint. De lucht geurt van bloesem en het eerste gemaaide gras. De vogels geven hun concert bij de opgaande zon. De lente is een uitstekend jaargetijde om op vakantie te gaan in het Nationale Landschap Winterswijk.
De lente loopt van maart tot en met juni op Camping Het Wieskamp. Natuurlijk is er met Pasen, Hemelvaart en Pinksteren veel te beleven op het terrein. Maar daarom heen vindt u de rust op de standplaats, en ook erbuiten. Al wandelend of fietsend ontdekt u de nestelende vogels. de bloeiende hoogstamfruitbomen en het frisse groen van de omliggende natuurgebieden.
</td>
<td width="40"></td>
</tr>
</table>
</div>
<!--[if gte mso 9]>
</v:textbox>
</v:rect>
<![endif]-->
</td>
</tr>
<tr>
<td background="http://www.wieskamp.nl/media/nieuwsbrief/wieskamp-nieuwsbrief-footer.jpg" bgcolor="#f6f6f6" width="600" height="88" valign="top">
<!--[if gte mso 9]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:600px;height:88px;">
<v:fill type="tile" src="http://www.wieskamp.nl/media/nieuwsbrief/wieskamp-nieuwsbrief-footer.jpg" color="#f6f6f6" size="600px,88px"/>
<v:textbox inset="0,0,0,0">
<![endif]-->
<div>
</div>
<!--[if gte mso 9]>
</v:textbox>
</v:rect>
<![endif]-->
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>