Пробел между двумя html-таблицами электронной почты Outlook 2007, 2013

Question

Быстрый вопрос. У меня есть две таблицы, сидящие рядом друг с другом, все хорошо, но в Outlook 2007 и 2013 есть место в середине этих двух таблиц. Ширина около 50px.

Я пробовал почти все, что мог придумать.

Вот что у меня есть.

<table border="0" cellpadding="0" cellspacing="0" align="left" class="w640" width="320"> 
    <tr><!-- Spacer --> <td height="10" width="100%"></td></tr> 
    <tr> 
     <td class="w640" height="320" width="320"> 
     <img src="image.jpg" alt="" style="display: block;" class="w640" height="320" width="320"> 
     </td> 
    </tr> 
    <tr><!-- Spacer --> <td height="10" width="100%"></td></tr> 
</table> 


<table border="0" cellpadding="0" cellspacing="0" align="right" class="w640" height="285" width="320" style="display: block;"> 
    <tr> 
     <td class="h0" height="40" width="100%"></td> 
    </tr> 
    <tr> 
     <td bgcolor="#4f77bd" class="w640" width="320"> 
      <table valign="center" align="center" valign="top" border="0" cellpadding="0" cellspacing="0" height="100%" width="100%"> 
      <tr><!-- Spacer --> <td height="15" width="100%" colspan="3"></td></tr> 
      <tr> 
       <td bgcolor="#4f77bd" width="20"></td> 
       <td align="center" width="280"> 
        <h2 style="font-size: 24px; font-family: Arial, sans-serif; color: #ffffff; margin-bottom: 0; margin-top: 0; text-align: center;">Freeman moves to take organisation globally</h2>   
       </td> 
       <td bgcolor="#4f77bd" width="20"></td> 
      </tr> 
      <tr><!-- Spacer --> <td height="20" width="100%" colspan="3"></td></tr> 
      <tr> 
       <td bgcolor="#4f77bd" width="20"></td> 
       <td align="center" width="280"> 
        <p style="font-size: 15px; font-family: 'Verdana', Arial, Helvetica; color: #ffffff; margin-bottom: 0; margin-top: 0; text-align: center;">Name is to focus her future activities on creating an international base for House and its services.</p> 
       </td> 
       <td bgcolor="#4f77bd" width="20"></td> 
      </tr> 
      <tr><!-- Spacer --> <td height="20" width="100%" colspan="3"></td></tr> 
      <tr> 
       <td bgcolor="#4f77bd" width="20"></td> 
       <td align="center" width="280"> 
        <p style="margin-bottom: 0; margin-top: 0; text-align: center;"> 
         <a href="#" style="color: #ffffff;">READ MORE</a> 
        </p> 
       </td> 
       <td bgcolor="#4f77bd" width="20"></td> 
      </tr> 
      <tr><!-- Spacer --> <td height="25" width="100%" colspan="3"></td></tr> 
      </table> 
     </td> 
    </tr> 
    <tr> 
     <td class="h0" height="20" width="100%"></td> 
    </tr> 
</table> 

Я не уверен, что не так с кодом, который у меня есть.

Answer 1

Ваша вторая таблица имеет attr align="right" и имущество display:block. попытайтесь удалить эти вещи. Надеюсь, что это будет ее исправить ..

HTML

<table border="0" cellpadding="0" cellspacing="0" align="left" class="w640" width="320"> 
    <tr> 
     <!-- Spacer --> 
     <td height="10" width="100%"></td> 
    </tr> 
    <tr> 
     <td class="w640" height="320" width="320"> 
      <img src="image.jpg" alt="" style="display: block;" class="w640" height="320" width="320"> 
     </td> 
    </tr> 
    <tr> 
     <!-- Spacer --> 
     <td height="10" width="100%"></td> 
    </tr> 
</table> 
<table border="0" cellpadding="0" cellspacing="0" align="" class="w640" height="285" width="320" style=""> 
    <tr> 
     <td class="h0" height="40" width="100%"></td> 
    </tr> 
    <tr> 
     <td bgcolor="#4f77bd" class="w640" width="320"> 
      <table valign="center" align="center" valign="top" border="0" cellpadding="0" cellspacing="0" height="100%" width="100%"> 
       <tr> 
        <!-- Spacer --> 
        <td height="15" width="100%" colspan="3"></td> 
       </tr> 
       <tr> 
        <td bgcolor="#4f77bd" width="20"></td> 
        <td align="center" width="280"> 
         <h2 style="font-size: 24px; font-family: Arial, sans-serif; color: #ffffff; margin-bottom: 0; margin-top: 0; text-align: center;">Freeman moves to take organisation globally</h2> 
        </td> 
        <td bgcolor="#4f77bd" width="20"></td> 
       </tr> 
       <tr> 
        <!-- Spacer --> 
        <td height="20" width="100%" colspan="3"></td> 
       </tr> 
       <tr> 
        <td bgcolor="#4f77bd" width="20"></td> 
        <td align="center" width="280"> 
         <p style="font-size: 15px; font-family: 'Verdana', Arial, Helvetica; color: #ffffff; margin-bottom: 0; margin-top: 0; text-align: center;">Name is to focus her future activities on creating an international base for House and its services.</p> 
        </td> 
        <td bgcolor="#4f77bd" width="20"></td> 
       </tr> 
       <tr> 
        <!-- Spacer --> 
        <td height="20" width="100%" colspan="3"></td> 
       </tr> 
       <tr> 
        <td bgcolor="#4f77bd" width="20"></td> 
        <td align="center" width="280"> 
         <p style="margin-bottom: 0; margin-top: 0; text-align: center;"> <a href="#" style="color: #ffffff;">READ MORE</a> 

         </p> 
        </td> 
        <td bgcolor="#4f77bd" width="20"></td> 
       </tr> 
       <tr> 
        <!-- Spacer --> 
        <td height="25" width="100%" colspan="3"></td> 
       </tr> 
      </table> 
     </td> 
    </tr> 
    <tr> 
     <td class="h0" height="20" width="100%"></td> 
    </tr> 
</table> 

Fiddle Demo