Outlook 2010 for PC HTML电子邮件中的错误
我正在为客户开发HTMl电子邮件。似乎标准和直截了当，而且远不是那么复杂。我使用嵌套表，所有（我认为）是正确的CSS规则和参数。但是，当电子邮件发送给拥有Outlook 2009 - 2013的人时，第二行嵌套表会发生一件奇怪的事情（见图）。
Outlook嵌套表错误
如果我将块从第1行切换到第2行，依此类推，则仍会出现错误。我已经在每个<td>和所有必要的内联中投入了很高的高度，但我无法修复错误。似乎无论我做什么，第二排都会破裂。
有人看到我的代码中可能没有的东西吗？
#outlook a{
padding:0;
}
.ReadMsgBody{
width:100%;
}
body{
width:100% !important;
min-width:100%;
-webkit-text-size-adjust:100%;
-ms-text-size-adjust:100%;
-webkit-font-smoothing: antialiased;
}
v*{
behavior:url(#default#VML);
display:inline-block;
}
td{
border-collapse: separate !important;
}
.ExternalClass,
.ExternalClass p,
.ExternalClass span,
.ExternalClass font,
.ExternalClass td,
.ExternalClass div{
line-height:100%;
}
a img{
border:none;
}
a {
text-decoration:none !important;
}
img{
display:block;
outline:none;
text-decoration:none;
border:none !important;
-ms-interpolation-mode: bicubic;
}
table, table td{
border-spacing:0;
border-collapse: separate;
mso-table-lspace:0pt;
mso-table-rspace:0pt;
padding: 0;
margin: 0;
}
table[class=full] {
width: 100%;
clear: both;
}
div {
padding: 0;
margin: 0;
}
p{
margin:0;
padding:0;
margin-bottom: 0;
line-height:1.4em;
font-size:100%;
font-family: Helvetica, Arial, sans-serif;
}
h1{
margin:0;
padding:0;
border:0;
font-size:100%;
line-height:1.4em;
font-family: Helvetica, Arial, sans-serif;
}
#wrappertable{
margin:0;
padding:0;
width:100% !important;
line-height:100% !important;
}
br[class=show]{
display: none !important;
max-height: 0px;
font-size: 0px;
overflow: hidden;
mso-hide: all;
}
@media screen and (max-width:600px){
table{
width:100% !important;
}
table[class=content]{
width:95% !important;
}
td[class=hide]{
display: none !important;
max-height: 0px !important;
font-size: 0px !important;
overflow: hidden !important;
mso-hide: all !important;
width: 0 !important;
}
td[class=fullwidth]{
width:100% !important;
float:left !important;
}
/*replace image with mobile version*/
td#pic1 img{
content:url("http://www.immediatefill.com/SendyImages/AP/S9496ROW/images/header-mobile.jpg") !important;
}
div[class=height]{
height: auto !important;
}
/*repeat ID as necessary*/
img[class=fullwidth]{
width:100% !important;
height:auto !important;
}
img[class=threequarters]{
float: none !important;
width: 75% !important;
height: auto !important;
margin: auto !important;
}
img[class=twothirds]{
float: none !important;
width: 66.6666% !important;
height: auto !important;
margin: auto !important;
}
img[class=halfwidth]{
float: none !important;
width: 50% !important;
height: auto !important;
margin: auto !important;
}
img[class=onethird]{
width: 33.3333% !important;
height: auto !important;
margin: auto !important;
padding-top: 5px !important;
padding-bottom: 5px !important;
}
img[class=quarterwidth]{
width: 25% !important;
height: auto !important;
margin: auto !important;
padding-top: 5px !important;
padding-bottom: 5px !important;
}
img[class=hide]{
display: none !important;
max-height: 0px !important;
font-size: 0px !important;
overflow: hidden !important;
mso-hide: all !important;
width: 0 !important;
}
div[class=fullwidth]{
max-width: 95% !important;
}
p,h1,h2[class=centered]{
text-align: center !important;
}
br[class=show]{
display: inline !important;
}
br[class=hide]{
display: none !important;
max-height: 0px;
font-size: 0px;
overflow: hidden;
mso-hide: all;
}
span[class=hide]{
display: none !important;
max-height: 0px;
font-size: 0px;
overflow: hidden;
mso-hide: all;
}
}<tr>
<td width="718" align="center">
<!--THIS IS THE CONTENT TABLE-->
<!--[if gte mso 9]>
<v:background xmlns:v="urn:schemas-microsoft-com:vml" fill="t">
<v:fill type="tile" src="THIS IS YOUR IMAGE PATH" color="#FFFFFF"/>
</v:background>
<![endif]-->
<table cellpadding="0" cellspacing="0" border="0" width="700">
<tr>
<td align="center"><a href="http://www.advantageprogram.net" target="_blank"><img src="http://www.immediatefill.com/SendyImages/AP/S9496ROW/images/AP_LPG_BANNER_ENG.png" width="700" height="102" alt="Lowest Price Guarantee" class="fullwidth"/></a>
</td>
</tr>
<tr>
<td align="center" bgcolor="#1e8de6" style="background-color: #1e8de6">
<table cellpadding="0" cellspacing="0" border="0" class="content" width="95%" height="70">
<tr><td colspan="2" height="14" style="line-height: 14px"></td></tr>
<tr>
<td class="fullwidth">
<a href="http://www.advantageprogram.net" target="_blank"><img src="http://www.immediatefill.com/SendyImages/AP/S9496ROW/images/AP-Logo_clear.png" width="250" height="42" alt="Advantage Program" class="twothirds" vspace="10"/></a>
</td>
<td class="fullwidth">
<p style="font-size: 21px; text-align: right; color: #FFFFFF; line-height: 32px;" class="centered"><strong>FEATURED</strong> <span style="font-weight: lighter !important">LOCATIONS</span></p>
</td>
</tr>
<tr><td colspan="2" height="14" style="line-height: 14px"></td></tr>
</table>
</td>
</tr>
<tr>
<td align="center" id="pic1">
<a href="http://www.advantageprogram.net" target="_blank"><img src="http://www.immediatefill.com/SendyImages/AP/S9496ROW/images/header.jpg" width="700" height="470" alt="" class="fullwidth"/></a>
</td>
</tr>
<tr>
<td align="center"><br />
<p style="text-align: center; color: #1e8de6; font-size: 26px; font-weight: light"><font style="color: #1e8de6; text-align: center; font-size: 26px; font-weight: light"><strong>Find your favorite Wyndham and book today!</strong></font></p>
<br />
</td>
</tr>
<tr>
<td align="center">
<table cellpadding="0" cellspacing="0" border="0" width="640">
<tr>
<td class="fullwidth" align="center">
<table cellpadding="0" cellspacing="0" border="0" width="320">
<tr><td style="height: 10px; line-height: 10px;" height="10" colspan="3"></td></tr>
<tr>
<td width="10" style="width: 10px !important;" align="center"> </td>
<td align="center" width="300" valign="top">
<!--property table-->
<table cellpadding="0" cellspacing="0" border="0" width="300" style="width: 300px; border: solid 1px #1e8de6; border-radius: 5px;" >
<tr>
<td style="border-top-left-radius: 5px; border-top-right-radius: 5px; border-collapse: collapse; mso-table-lspace:0pt;mso-table-rspace:0pt; line-height: 168px;" class="fullwidth" align="center">
<img src="http://www.immediatefill.com/SendyImages/HLL/testing/Property3.jpg" width="300" height="168" alt="" class="fullwidth" style="display: block !important;"/>
</td>
</tr>
<tr><td style="height: 10px; line-height: 10px;" height="10"></td></tr>
<tr>
<td align="center" height="60" style="line-height: 60px; border-collapse: collapse; mso-table-lspace:0pt;mso-table-rspace:0pt;">
<p style="color: #1e8de6; font-size: 19px; font-weight: lighter; line-height: 24px;">Wyndham Ocean Boulevard</p>
<p style="color: #1e8de6; font-size: 15px; font-weight: bolder; line-height: 19px;">Myrtle Beach, SC</p>
</td>
</tr>
<tr><td style="height: 10px; line-height: 10px;" height="10"></td></tr>
<tr>
<td align="center" class="fullwidth">
<table cellpadding="0" cellspacing="0" border="0" width="300" class="content">
<tr>
<td width="10" style="width: 10px !important;"></td>
<td align="center" valign="top" height="260" style="line-height: 260px !important; height: 260px !important; width: 280px !important; border-collapse: collapse; mso-table-lspace:0pt;mso-table-rspace:0pt;" width="280" class="fullwidth">
<p style="color: #666666; font-size: 13px; line-height: 21px !important; font-family: Arial, 'sans-serif'; mso-line-height-rule: exactly;" >A stay at the stylish Wyndham Ocean Boulevard will certainly be one to remember. Enjoy award-winning accommodations and amenities surrounded by gentle waves of North Myrtle Beach. This spectacular high-rise, beachfront property is where retro-flavor meets a stylish, contemporary finish. You will certainly love returning to these one and two private bedroom vacation condos complete with full kitchen, washer and dryer and spacious living areas.</p></td>
<td width="10" style="width: 10px !important;"></td>
</tr>
</table>
</td>
</tr>
<tr><td style="height: 20px; line-height: 20px;" height="20"></td></tr>
<tr>
<td align="center" height="42" style="line-height: 42px;">
<div><!--[if mso]>
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="http://www.advantageprogram.net" style="height:40px;v-text-anchor:middle;width:180px;" arcsize="10%" stroke="f" fillcolor="#1e8de6">
<w:anchorlock/>
<center>
<![endif]-->
<a href="http://www.advantageprogram.net"
style="background-color:#1e8de6;border-radius:5px;color:#ffffff;display:inline-block;font-family:sans-serif;font-size:18px;font-weight:lighter;line-height:40px;text-align:center;text-decoration:none;width:180px;-webkit-text-size-adjust:none;">Book Now!</a>
<!--[if mso]>
</center>
</v:roundrect>
<![endif]--></div>
</td>
</tr>
<tr><td style="height: 20px; line-height: 20px;" height="20"></td></tr>
</table>
</td>
<td width="10" style="width: 10px !important;" align="center"> </td>
</tr>
<tr><td style="height: 10px; line-height: 10px;" height="10" colspan="3"></td></tr>
</table>
</td>
<td class="fullwidth" align="center">
<table cellpadding="0" cellspacing="0" border="0" width="320">
<tr><td style="height: 10px; line-height: 10px;" height="10" colspan="3"></td></tr>
<tr>
<td width="10" style="width: 10px !important;" align="center"> </td>
<td align="center" width="300" valign="top">
<!--property table-->
<table cellpadding="0" cellspacing="0" border="0" width="300" style="width: 300px; border: solid 1px #1e8de6; border-radius: 5px;" >
<tr>
<td style="border-top-left-radius: 5px; border-top-right-radius: 5px; border-collapse: collapse; line-height: 168px; mso-table-lspace:0pt;mso-table-rspace:0pt;" class="fullwidth" align="center">
<img src="http://www.immediatefill.com/SendyImages/HLL/testing/Property4.jpg" width="300" height="168" alt="" class="fullwidth" style="display: block !important;"/>
</td>
</tr>
<tr><td style="height: 10px; line-height: 10px;" height="10"></td></tr>
<tr>
<td align="center" height="60" style="line-height: 60px; border-collapse: collapse; mso-table-lspace:0pt;mso-table-rspace:0pt;">
<p style="color: #1e8de6; font-size: 19px; font-weight: lighter; line-height: 24px;">Wyndham Resort at Avon</p>
<p style="color: #1e8de6; font-size: 15px; font-weight: bolder; line-height: 19px;">Avon, Colorado</p>
</td>
</tr>
<tr><td style="height: 10px; line-height: 10px;" height="10"></td></tr>
<tr>
<td align="center" class="fullwidth">
<table cellpadding="0" cellspacing="0" border="0" width="300" class="content">
<tr>
<td width="10" style="width: 10px !important;"></td>
<td align="center" valign="top" height="260" style="line-height: 260px !important; height: 260px !important; width: 280px !important; border-collapse: collapse; mso-table-lspace:0pt;mso-table-rspace:0pt;" width="280" class="fullwidth">
<p style="color: #666666; font-size: 13px; line-height: 21px !important; font-family: Arial, 'sans-serif'; mso-line-height-rule: exactly;" >Right in the heart of Rocky Mountain ski country, friendly alpine villages welcome visitors from around the world. Tucked across the Eagle River from Beaver Creek's famous slopes, this resort houses an array of apartment-style suites for up to 10 guests. Each features a full kitchen, fireplace, and private balcony. It's a dreamy place to call home, no matter the time of year.</p></td>
<td width="10" style="width: 10px !important;"></td>
</tr>
</table>
</td>
</tr>
<tr><td style="height: 20px; line-height: 20px;" height="20"></td></tr>
<tr>
<td align="center" height="42" style="line-height: 42px;">
<div><!--[if mso]>
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="http://www.advantageprogram.net" style="height:40px;v-text-anchor:middle;width:180px;" arcsize="10%" stroke="f" fillcolor="#1e8de6">
<w:anchorlock/>
<center>
<![endif]-->
<a href="http://www.advantageprogram.net"
style="background-color:#1e8de6;border-radius:5px;color:#ffffff;display:inline-block;font-family:sans-serif;font-size:18px;font-weight:lighter;line-height:40px;text-align:center;text-decoration:none;width:180px;-webkit-text-size-adjust:none;">Book Now!</a>
<!--[if mso]>
</center>
</v:roundrect>
<![endif]--></div>
</td>
</tr>
<tr><td style="height: 20px; line-height: 20px;" height="20"></td></tr>
</table>
</td>
<td width="10" style="width: 10px !important;" align="center"> </td>
</tr>
<tr><td style="height: 10px; line-height: 10px;" height="10" colspan="3"></td></tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="718" align="center">
<!--THIS IS THE CONTENT TABLE-->
<!--[if gte mso 9]>
<v:background xmlns:v="urn:schemas-microsoft-com:vml" fill="t">
<v:fill type="tile" src="THIS IS YOUR IMAGE PATH" color="#FFFFFF"/>
</v:background>
<![endif]-->
<table cellpadding="0" cellspacing="0" border="0" width="700">
<tr>
<td align="center">
<table cellpadding="0" cellspacing="0" border="0" width="640">
<tr>
<td class="fullwidth" align="center" height="570" valign="top">
<table cellpadding="0" cellspacing="0" border="0" width="320">
<tr><td style="height: 10px; line-height: 10px;" height="10" colspan="3"></td></tr>
<tr>
<td width="10" style="width: 10px !important;" align="center"> </td>
<td align="center" width="300" valign="top">
<!--property table-->
<table cellpadding="0" cellspacing="0" border="0" width="300" style="width: 300px; border: solid 1px #1e8de6; border-radius: 5px;" >
<tr>
<td style="border-top-left-radius: 5px; border-top-right-radius: 5px; border-collapse: collapse; line-height: 168px;" class="fullwidth" align="center" height="168">
<img src="http://www.immediatefill.com/SendyImages/HLL/testing/Property1.jpg" width="300" height="168" alt="" class="fullwidth" style="display: block !important;"/>
</td>
</tr>
<tr><td style="height: 10px; line-height: 10px;" height="10"></td></tr>
<tr>
<td align="center" height="60" style="line-height: 60px;">
<p style="color: #1e8de6; font-size: 19px; font-weight: lighter; line-height: 24px;">Wyndham at Waikiki Beach Walk</p>
<p style="color: #1e8de6; font-size: 15px; font-weight: bolder; line-height: 19px;">Waikiki Beach, Hawaii</p>
</td>
</tr>
<tr><td style="height: 10px; line-height: 10px;" height="10"></td></tr>
<tr>
<td align="center" class="fullwidth">
<table cellpadding="0" cellspacing="0" border="0" width="300" class="content">
<tr>
<td width="10" style="width: 10px !important; height: 400px;" height="400"> </td>
<td align="center" valign="top" height="400" style="line-height: 400px !important; height: 400px !important; width: 280px !important; border-collapse: collapse; mso-table-lspace:0pt;mso-table-rspace:0pt;" width="280" class="fullwidth">
<p style="color: #666666; font-size: 13px; line-height: 21px !important; font-family: Arial, 'sans-serif'; mso-line-height-rule: exactly;" >Wyndham at Waikiki Beach Walk offers a premium location just one block from Oahu's famous Waikiki Beach. Guests have easy access to shopping, dining, and live entertainment. The resort offers guests planned activities, classes, and games for adults, children and families. You will find yourself in a paradise where you can relax on a sandy beach, enjoy swimming in the Pacific Ocean, or find excitement just steps away!</p>
</td>
<td width="10" style="width: 10px !important; height:400px;" height="400"> </td>
</tr>
</table>
</td>
</tr>
<tr><td style="height: 20px; line-height: 20px;" height="20"></td></tr>
<tr>
<td align="center" height="42" style="line-height: 42px;">
<div><!--[if mso]>
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="http://www.advantageprogram.net" style="height:40px;v-text-anchor:middle;width:180px;" arcsize="10%" stroke="f" fillcolor="#1e8de6">
<w:anchorlock/>
<center>
<![endif]-->
<a href="http://www.advantageprogram.net"
style="background-color:#1e8de6;border-radius:5px;color:#ffffff;display:inline-block;font-family:sans-serif;font-size:18px;font-weight:lighter;line-height:40px;text-align:center;text-decoration:none;width:180px;-webkit-text-size-adjust:none;">Book Now!</a>
<!--[if mso]>
</center>
</v:roundrect>
<![endif]--></div>
</td>
</tr>
<tr><td style="height: 20px; line-height: 20px;" height="20"></td></tr>
</table>
</td>
<td width="10" style="width: 10px !important;" align="center"> </td>
</tr>
<tr><td style="height: 10px; line-height: 10px;" height="10" colspan="3"></td></tr>
</table>
</td>
<td class="fullwidth" align="center" height="570" valign="top">
<table cellpadding="0" cellspacing="0" border="0" width="320">
<tr><td style="height: 10px; line-height: 10px;" height="10" colspan="3"></td></tr>
<tr>
<td width="10" style="width: 10px !important;" align="center"> </td>
<td align="center" width="300" valign="top">
<!--property table-->
<table cellpadding="0" cellspacing="0" border="0" width="300" style="width: 300px; border: solid 1px #1e8de6; border-radius: 5px;" >
<tr>
<td style="border-top-left-radius: 5px; border-top-right-radius: 5px; border-collapse: collapse" class="fullwidth" align="center">
<img src="http://www.immediatefill.com/SendyImages/HLL/testing/Property2.jpg" width="300" height="168" alt="" class="fullwidth" style="display: block !important;"/>
</td>
</tr>
<tr><td style="height: 10px; line-height: 10px;" height="10"></td></tr>
<tr>
<td align="center" height="60" style="line-height: 60px;">
<p style="color: #1e8de6; font-size: 19px; font-weight: lighter; line-height: 24px;">Wyndham Bonnet Creek Resort</p>
<p style="color: #1e8de6; font-size: 15px; font-weight: bolder; line-height: 19px;">Orlando, Florida</p>
</td>
</tr>
<tr><td style="height: 10px; line-height: 10px;" height="10"></td></tr>
<tr>
<td align="center" class="fullwidth">
<table cellpadding="0" cellspacing="0" border="0" width="300" class="content">
<tr>
<td width="10" style="width: 10px !important; height:400px;" height="400"> </td>
<td align="center" valign="top" height="400" style="line-height: 400px !important; height: 400px !important; width: 280px !important; border-collapse: collapse; mso-table-lspace:0pt;mso-table-rspace:0pt;" width="280" class="fullwidth">
<p style="color: #666666; font-size: 13px; line-height: 21px !important; font-family: Arial, 'sans-serif'; mso-line-height-rule: exactly;" >Located adjacent to Walt Disney World Resort, Wyndham Bonnet Creek Resort is the perfect home base in Lake Buena Vista for all kinds of Orlando adventures, and is just a few minutes' drive to Universal Orlando Resort and Wet 'n Wild. Guests have a blast with all the fun and exciting activities available at Wyndham Bonnet Creek Resort, designed to enhance family vacations with unexpected pleasures.</p></td>
<td width="10" style="width: 10px !important;"></td>
</tr>
</table>
</td>
</tr>
<tr><td style="height: 20px; line-height: 20px;" height="20"></td></tr>
<tr>
<td align="center" height="42" style="line-height: 42px;">
<div><!--[if mso]>
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="http://www.advantageprogram.net" style="height:40px;v-text-anchor:middle;width:180px;" arcsize="10%" stroke="f" fillcolor="#1e8de6">
<w:anchorlock/>
<center>
<![endif]-->
<a href="http://www.advantageprogram.net"
style="background-color:#1e8de6;border-radius:5px;color:#ffffff;display:inline-block;font-family:sans-serif;font-size:18px;font-weight:lighter;line-height:40px;text-align:center;text-decoration:none;width:180px;-webkit-text-size-adjust:none;">Book Now!</a>
<!--[if mso]>
</center>
</v:roundrect>
<![endif]--></div>
</td>
</tr>
<tr><td style="height: 20px; line-height: 20px;" height="20"></td></tr>
</table>
</td>
<td width="10" style="width: 10px !important;" align="center"> </td>
</tr>
<tr><td style="height: 10px; line-height: 10px;" height="10" colspan="3"></td></tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="718" align="center">
<table cellpadding="0" cellspacing="0" border="0" width="700">
<tr>
<td align="center">
<table cellpadding="0" cellspacing="0" border="0">
<tr><td height="25" style="line-height: 25px;"></td></tr>
<tr>
<td align="center">
<p style="font-size: 28px; text-align: center; color: #666666;">Promo Code: <span style="color: #1e8de6; font-size: 40px; font-weight: bold">S9496ROW</span></p>
</td>
</tr>
<tr><td height="25" style="line-height: 25px;"></td></tr>
</table>
</td>
</tr>
<tr>
<td align="center" bgcolor="#1e8de6" style="background-color: #1e8de6">
<img src="http://www.immediatefill.com/SendyImages/AP/S9496ROW/images/numbers.png" width="550" height="118" alt="" class="fullwidth"/></td>
</tr>
<tr>
<td align="center" bgcolor="#1e8de6" style="background-color: #1e8de6">
<a href="mailto:service@advantageprogram.net?subject=Now Available! Wherever you want to be, Wyndham is there! Book Now! Code: S9496ROW"><img src="http://www.immediatefill.com/SendyImages/AP/S9496ROW/images/email.png" width="350" height="45" alt="email: Service@Advantageprogram.net" class="fullwidth"/></a></td>
</tr>
<tr><td height="10" style="line-height: 10px;"></td></tr>
<tr>
<td align="center" >
<p style="font-size:11px; color:#626262; line-height: 22px;">Advantage Program • P.O. Box 35076 • Las Vegas, NV 89133-5076 • USA</p>
<p><a href="[unsubscribe]" title="Unsubscribe" style="text-decoration:none; font-size:11px; color:#626262; line-height: 22px;">Unsubscribe from this list</a></p>
</td>
</tr>
</table>
</td>
</tr>
0 个答案:
没有答案
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？