【问题标题】:Width issue - Outlook 2010宽度问题 - Outlook 2010
【发布时间】:2014-05-20 20:53:56
【问题描述】:

这是我的剥离代码:

<table border="0" width="650" cellspacing="0" cellpadding="5" style="border-style: none; background-color: #fff; border-collapse: collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;">
<tr>
<td>
<table border="0" width="210" cellspacing="0" cellpadding="0" style="border: 1px solid #ccc; border-radius: 5px; background-color: #fff; border-collapse: collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;">
<tr>
<td style="font-family: Arial, Verdana, Georgia, Times New Roman, Tahoma, Trebuchet, sans-serif; text-align: center; word-break: break-all;">
<span id="" class="txt" style="font-size: 15px; font-weight: bold; line-height: 22px;">
    Some Text
</span>
</td>
</tr>
<tr>
<td>
<table border="0" width="100" cellspacing="0" cellpadding="0" style="border-style: none; background-color: #fff; border-collapse: collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;">
<tr>
<td style="font-family: Arial, Verdana, Georgia, Times New Roman, Tahoma, Trebuchet, sans-serif; text-align: left;">
<span id="sma" class="txt" style="font-size: 0px; font-weight: bold; color: #000;">
    <img src="picture_95x95.jpg" align="left" vspace="0" hspace="0" alt="Smartfon" style="border-style: none; display: block;" />
</span>
</td>
<td>
<table border="0" width="100" cellspacing="5" cellpadding="5" style="border-style: none; background-color: #fff; border-collapse: collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;">
<tr>
<td style="font-family: Arial, Verdana, Georgia, Times New Roman, Tahoma, Trebuchet, sans-serif; text-align: right; word-break: break-all;">
<span id="pra" class="txt" style="font-size: 26px; font-weight: normal; color: #a40133; line-height: 44px;">
    Text X1
</span>
</td>
</tr>
<tr>
<td style="font-family: Arial, Verdana, Georgia, Times New Roman, Tahoma, Trebuchet, sans-serif; text-align: center; background-color: #a40133; border-radius: 5px; mso-line-height-rule: exactly; line-height: 20px; word-break: break-all;">
<span id="cha" class="txt" style="font-size: 14px; font-weight: bold;">
<a href="#" style="color: #fff; text-decoration: none;">
    Text X2
</a>
</span>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>

这就是问题所在。表格宽度严格为 210,但在 Outlook 中看起来像 211。我不知道如何摆脱这个 1px。我几乎尝试了所有方法,现在我无语了。

任何想法将不胜感激。提前谢谢你。

【问题讨论】:

  • 也许是在表格的宽度上添加了边框?让它变成 212?

标签: html css outlook-2010


【解决方案1】:

在您的代码中更改以下内容

 <table border="0" width="210" cellspacing="0" cellpadding="0" style="border: 1px solid #ccc; border-radius: 5px; background-color: #fff; border-collapse: collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;">

<table border="0" width="212" cellspacing="0" cellpadding="0" style="border: 1px solid #ccc; border-radius: 5px; background-color: #fff; mso-table-lspace:0pt; mso-table-rspace:0pt;">

检查下面的jsfiddle

http://jsfiddle.net/3H2g6/5/

【讨论】:

  • 我试过这个。现在表格的大小严格为 209 :-( 无论如何感谢您的努力。
  • 我已经更新了我的答案。现在检查一下,如果需要任何澄清,请检查 jsfiddle。
  • 谢谢。我删除了“border-collapse:collapse”。现在我的表格宽度为 214。仍然,我得到了 2 个额外的像素。即使我将表格宽度设置为 208,它也不起作用,因为其他电子邮件客户端会将此值设置为 208 而不是 210。
  • :) 删除表格宽度属性并为表格列添加宽度:210px。
  • 你能告诉我正确的代码吗?因为我不确定。谢谢。
猜你喜欢
  • 2012-12-02
  • 1970-01-01
  • 2015-08-02
  • 1970-01-01
  • 1970-01-01
  • 2012-05-31
  • 2015-05-11
  • 1970-01-01
  • 2011-10-07
相关资源
最近更新 更多