0

I have a single table HTML with 3 columns (25px : 580px : 25px) with white background throughout table, trs and tds. All works in every browser except Outlook 2010.

In Outlook 2010 I am receiving vertical gaps in the two outer columns between table rows - its about a 3px gap. It appears the background white is either not displaying throughout the cell or Outlook is adding in a line break or similar.

Screenshot here:

http://postimage.org/image/ft3zqg7jl/

The structure of the affected rows is as:

<tr><td height="20" width="25" align="left" valign="top" bgcolor="#ffffff"></td>
<td height="20" width="580" align="left" valign="top" bgcolor="#ffffff"></td>
<td height="20" width="25" align="left" valign="top" bgcolor="#ffffff"></td>
</tr>

Anyone any ideas what causes this and how to resolve?

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
John E Bevan
  • 1
  • 2

2 Answers2

0

Possible solutions:

  1. Set background-color: #ffffff with CSS
  2. Add a &nbsp; in the affected tds and use CSS to set font-size: 0px and line-height: 0px
  3. Try both of the above at the same time :)
Horen
  • 11,184
  • 11
  • 71
  • 113
0

Images should be set to inline display:block

Add into your embedded CSS:

table, table td { border:0; border-collapse:collapse; mso-table-lspace:0; mso-table-rspace:0; margin:0; padding:0; }`

You should put your bgcolors in the tag instead of table-cells:

<table bgcolor="#ededed" cellpadding="0" cellspacing="0" border="0">
<tr>
  <td>
    <table bgcolor="#ffffff"cellpadding="0" cellspacing="0" border="0">
    <tr>
       <td height="20" width="25" align="left" valign="top"></td>
      <td height="20" width="580" align="left" valign="top"></td>
      <td height="20" width="25" align="left" valign="top" ></td>
    </tr>
    </table>
  </td>
</tr>
</table>
josh1978
  • 698
  • 7
  • 19