【发布时间】:2017-07-26 01:31:39
【问题描述】:
我在父表中创建了 2 个子表。在除 Outlook 2007/2010/2013 和 2016 之外的所有电子邮件客户端中,表格的宽度看起来都很好。右列向右移动并忽略两侧的 TD 宽度(5%)。谁能帮我解决这个问题?
代码如下:
`
<!-- Second slider -->
<tr>
<td align="center" valign="top">
<table class="parentTable" border="0" cellpadding="0" cellspacing="0" style="table-layout:fixed;">
<tr>
<!-- 1st column - spacing -->
<!-- <td valign="top" width="5%"> </td> -->
<!-- 2nd column - left section -->
<td valign="top" width="50%">
<table class="childTable" border="0" cellpadding="0" cellspacing="0" style="table-layout:fixed;border:none;border-collapse:collapse;mso-table-lspace:0;mso-table-rspace:0;">
<tr>
<td valign="top" width="5%" > </td>
<td width="40%">
<table class="list-table_1" border="0" cellpadding="0" cellspacing="0" style="border:none;border-collapse:collapse;mso-table-lspace:0;mso-table-rspace:0;">
<tr>
<td valign="top" align="left" >
<p class="heading_1" style="font-family: Georgia, serif;">Left Column Content 1</p>
</td>
</tr>
<tr>
<td valign="top" align="center" height="10"> </td>
</tr>
<tr>
<td valign="top" align="center" >
<img src="" class="img-responsive" alt="" style="max-width: 100%;" />
</td>
</tr>
<tr>
<td valign="top" align="center" height="5"> </td>
</tr>
<tr>
<td valign="top" align="left" >
<p class="heading_2" style="font-family:Georgia, serif;">Left Column Content 2</p>
</td>
</tr>
</table>
</td>
<td valign="top" width="5%" style="border-right:1px solid #0060af;"> </td>
</tr>
</table>
</td>
<td valign="top" width="50%">
<table class="childTable" border="0" cellpadding="0" cellspacing="0" style="table-layout:fixed;border:none;border-collapse:collapse;mso-table-lspace:0;mso-table-rspace:0;">
<tr>
<td valign="top" width="5%" > </td>
<td width="40%">
<table class="list-table_1" border="0" cellpadding="0" cellspacing="0" style="border:none;border-collapse:collapse;mso-table-lspace:0;mso-table-rspace:0;">
<tr>
<td valign="top" align="left" >
<p class="heading_1" style="font-family: Georgia, serif;">Right Column Content 1</p>
</td>
</tr>
<tr>
<td valign="top" align="center" height="10"> </td>
</tr>
<tr>
<td valign="top" align="center" >
<img src="" class="img-responsive" alt="" style="max-width: 100%;" />
</td>
</tr>
<tr>
<td valign="top" align="center" height="5"> </td>
</tr>
<tr>
<td valign="top" align="left" >
<p class="heading_2" style="font-family:Georgia, serif;">Right Column Content 2</p>
</td>
</tr>
</table>
</td>
<td valign="top" width="5%"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<!-- Second slider ends -->
</table>
</td>
</tr>
</table>
`
谢谢
【问题讨论】:
-
在 IE 9、10、11 等中看起来也不错吗?
-
Outlook 不是浏览器,您不能指望电子邮件客户端的行为方式相同。
-
@Rob:我的错。大多数电子邮件客户端的行为方式相同或有些接近但并不完全不同。
-
@User00000: 是的
-
Outlook 对任何开发者来说都是一场噩梦。 2021 年和发展中仍然感觉像在 1999 年