2013-05-06 355 views
0

我已经经历了很多线程,但找不到有用的东西。如果这是重复的,请将我指向相关主题。当在Outlook中查看时,表格的边框右侧未显示在电子邮件模板中

我们为我们的一个网站创建了一个自定义RSS源,以实现我们想要的模板设计。我已经设法使它看起来很好,几乎在任何地方都可以期待展望,这是一种痛苦!

我面临的主要问题是我无法在我的一个框中显示正确的边框。 请参考附件截图。 enter image description here

这是我的HTML。我也尝试了使用百分比的宽度,但也没有工作。

<table width="525" height="250" border="0" cellpadding="0" cellspacing="0" bgcolor="#fafafa" class="main-content" style="border:1px solid #ccc;"> 
    <tr> 
     <td width="50"><!-- --></td> 
     <td width="284" align="left" valign="middle"><img src="'.site_url().'/wp-content/uploads/'.$image.'" width="274" height="196" mc:edit="Box_image_2" mc:allowdesigner alt="" /></td> 
     <td width="20"><!-- --></td> 
     <td width="280" valign="top" > 
      <table width="220" border="0" cellpadding="0" cellspacing="0"> 
       <tr> 
        <td height="15"><!-- --></td> 
       </tr> 
       <tr> 
        <td align="left" class="body-text-bold" style="font-size:16px;font-weight:bold;" mc:edit="body_bold_text" mc:allowdesigner="mc:allowdesigner" ><strong>'.$deal['post_title'].'</strong></td> 
       </tr> 
       <tr> 
        <td height="16"><!-- --></td> 
       </tr> 
       <tr> 
        <td><!-- Red Box Start --> 
         <div class="red-box" style="background:#e9e9e9;border:1px solid #ccc;"> 
          <table border="0" align="center" cellpadding="0" cellspacing="0"> 
           <tr> 
            <td height="5"><!-- --></td> 
           </tr> 
           <tr> 
            <td width="7"><!-- --></td> 
            <td width="120" class="white-box" style="background:#ffffff;border:1px solid #ccc;"> 
             <table cellpadding="0" cellspacing="0" border="0"> 
              <tr> 
               <td height="5"><!-- --></td> 
              </tr> 
              <tr> 
               <td width="30"></td> 
               <td align="left" class="red-box-text" style="font-family:Arial, Helvetica, sans-serif;font-size:18px;font-weight:bold;" mc:edit="top_box_price_1" mc:allowdesigner="mc:allowdesigner">Τιμή</td> 
               <td width="30"></td> 
              </tr> 
              <tr> 
               <td height="5"><!-- --></td> 
              </tr> 
              <tr> 
               <td width="25"></td> 
               <td align="center" class="red-box-text" style="font-family:Arial, Helvetica, sans-serif;font-size:18px;font-weight:bold;" mc:edit="top_box_price_2" mc:allowdesigner="mc:allowdesigner">'.$price.'&#8364;</td> 
               <td width="20"></td> 
              </tr> 
              <tr> 
               <td height="5"></td> 
              </tr> 
             </table> 
            </td> 
            <td width="5"><!-- --></td> 
            <td width="120" class="white-box" style="background:#ffffff;border:1px solid #ccc;"> 
             <table cellpadding="0" cellspacing="0" border="0"> 
              <tr> 
               <td height="10"><!-- --></td> 
              </tr> 
              <tr> 
               <td width="25"></td> 
               <td align="left" class="red-box-text" style="font-family:Arial, Helvetica, sans-serif;font-size:18px;font-weight:bold;" mc:edit="top_box_discount_1" mc:allowdesigner="mc:allowdesigner">Έκπτωση</td> 
               <td width="30"></td> 
              </tr> 
              <tr> 
               <td height="5"><!-- --></td> 
              </tr> 
              <tr> 
               <td width="35"></td> 
               <td align="center" class="red-box-text" style="font-family:Arial, Helvetica, sans-serif;font-size:18px;font-weight:bold;" mc:edit="top_box_discount_2" mc:allowdesigner="mc:allowdesigner">'.$discount.'</td> 
               <td width="5"></td> 
              </tr> 
              <tr> 
               <td height="15"></td> 
              </tr> 
             </table> 
            </td> 
            <td width="5"><!-- --></td> 
            <td></td> 
           </tr> 
           <tr> 
            <td height="5"><!-- --></td> 
           </tr> 
          </table> 
         </div> 
        </td> 
       </tr> 
       <tr> 
        <td height="12"><!-- --></td> 
       </tr> 
       <tr> 
        <td align="left" class="body-text-bold" mc:edit="body_bold_text" mc:allowdesigner="mc:allowdesigner" ><!--REMOVED BY DUSTIN '.$deal['post_content'].'--></td> 
       </tr> 
       <tr> 
        <td height="0"><!-- --></td> 
       </tr> 
       <tr> 
        <td align="center" mc:edit="top_box_image" mc:allowdesigner="mc:allowdesigner" width="120px" style="background-color:#ac0003; color:#ffffff; border:1px solid #660b0e;cursor: pointer; display: block; font-family:Arial, Helvetica, sans-serif; font-size:12px; padding-top:5px; padding-bottom:5px; text-decoration:none; "><a style="color:#ffffff; text-decoration:none;" href="'.$deal['guid'].'" class="">Δες το Deal</a> </td> 
       </tr> 
      </table> 
     </td> 
     <td width="0"><!-- --></td> 
    </tr> 
</table> 

如果有帮助:我使用FEED标记通过MailChimp发送电子邮件。

在此先感谢您的帮助!

回答

1

我认为这个问题是由您的表格单元格的宽度造成的。尝试像这样每个单元格设置宽度的两倍:

<td width="10" style="width:10px;"> 

也将添加以下内嵌样式:

table td {border-collapse: collapse;} 
table { border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; } 

提示: 你可能需要指定哪些版本的Outlook导致的问题。例如,Outlook 2007/2010/2013的反应完全不同于Outlook 2003/2011的相同样式。

+0

你好@BraMKJ! 这是导致此问题的Outlook 2007,2010和2013年。 它看起来罚款2002和2003年 我觉得有东西从你的第一部分缺失,这条线之后:“试试像这样每个单元格设置宽度的两倍:” – 2013-05-14 14:46:28

+0

是的,忘了周围的代码的代码括号:) – BraMKJ 2013-05-15 08:11:41

+0

它与上面的代码工作? – BraMKJ 2013-05-30 11:47:31

0

简单地说,你可以不是垂直划分的图像,如果你那就会呈现1px的空间 - horizo​​ntaly分割图像和尝试。它将被解决

相关问题