I am creating a html email, and I need to add some vertical spacing between my tables. In order to get round the problem of margin-top and margin-bottom not being supported in Outlook 2007, 2010 and 2013 I decided to add spacing between my tables be using the fully supported border style.
I added a border to the bottom of my table, and ran it through premailer to get the following inline style:
<table align="center" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; width: 600px; border-bottom-width: 20px; border-bottom-color: #f3f2ef; background-color: white; border-style: none none solid;" bgcolor="white">
This works, however the border width for Outlook 2007, 2010 and 2013 is considerably less than for other email clients. I put the result into photoshop, and measured it at 8px, where it should be 20px.
Can anyone tell me what is causing this discrepancy please?
I may have an alternate solution if you're willing to let go of using border.
In my experience, border is unreliable, so I usually use a transparent spacer gif in a td, like this:
<tr>
<td bgcolor="#f3f2ef">
<img src="http://www.yourdomain.com/images/spacer.gif" style="display:block;" width="1" height="20" alt="">
</td>
</tr>
Make this as the last row in your table and you should be set.