So, I'm having issues with Outlook 2007/2010 spacing (border collapse?) issue.
Here is an image as to what it is doing (the Hurry Now.. text gets pushed down)
Here is what it is supposed to look like & works fine in all other email clients.
Here is my snippet of code for the Hero section
<table cellpadding="0" cellspacing="0" width="561" align="center" bgcolor="#4b88cf" style="font-family: Tahoma, Arial, Verdana, sans-serif; font-size:40px; font-weight:normal; line-height:40px; text-align:left; color:#ffffff; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;">
<tr>
<td width="561" height="37" style="font-size: 0; line-height: 0" bgcolor="#4b88cf"> </td>
</tr> <!-- end spacer -->
<tr>
<td height="48" valign="top" style="color: #ffffff;"><font color="#ffffff">Save 10% on all</font></td>
</tr> <!-- heading -->
<tr>
<td height="48" valign="top" style="color: #ffffff;"><font color="#ffffff">EasyACCT 2013 products.</font></td>
</tr> <!-- heading -->
<tr>
<td height="48" valign="top" style="color: #ffffff;"><font color="#ffffff">Only 4 days left!</font></td>
</tr> <!-- heading -->
<tr>
<td width="561" height="25" style="font-size: 0; line-height: 0" bgcolor="#4b88cf"> </td>
</tr> <!-- spacer here -->
<!-- start button -->
<tr>
<td>
<table cellpadding="0" cellspacing="0" align="left" style="font-family: Tahoma, Arial, Verdana, sans-serif; font-size:14px; font-weight:normal; line-height:20px; text-align:left; color:#ffffff; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;">
<tr>
<td style="border-collapse: collapse;"><img src="http://intuit.pistonclients.com/13-intu-r-1629/images/left-btn.png" border="0" style="display: block;" alt="left side button"/></td> <!-- left side button -->
<td align="center" style="font-weight: bold; border-collapse: collapse;" bgcolor="#f0640f"><a href="http://accountants.intuit.com/accounting/lp/quickbooks/easyacct-renew.jsp?s_cid=EM" style="text-decoration: none;"><font color="#ffffff" style="text-decoration: none;">Renew Now to Save 10%</font></a></td>
<td style="border-collapse: collapse;"><img src="http://intuit.pistonclients.com/13-intu-r-1629/images/right-btn.png" border="0" style="display: block;" alt="right side button"/></td> <!-- right side button -->
</tr>
</table>
</td>
</tr>
<!-- end button -->
<tr>
<td width="561" height="15" style="font-size: 0; line-height: 0; border-collapse: collapse;" bgcolor="#4b88cf"> </td>
</tr> <!-- spacer here -->
<tr>
<td valign="top" width="561" style="font-size: 18px; color: #ffffff; border-collapse: collapse;"><font color="#ffffff">Hurry, offer ends October 31!</font><sup style="font-size: 12px; line-height: 0; vertical-align: 8px"><font color="#ffffff">1</font></sup></td>
</tr>
<tr>
<td width="561" height="23" style="font-size: 0; line-height: 0; border-collapse: collapse;" bgcolor="#4b88cf"> </td>
</tr> <!-- spacer here -->
</table>
Best Answer
This is a problem I've come across with Outlook 2007,2010 and of course 2013. They don't like small cells.
I've found this code has worked for me and gone through Litmus tests.
The mso-line-height-rule: exactly; is an outlook specific style. The font-size: 1px should match however much height you want your cell to be. The line-height: 0px; zero's out any line-height space.
HOWEVER, after testing your code snippet with the updated cells this doesn't seem to be the actual problem. I made the spacer cells black so I could better see what was actually going on.
The black spacer cell ends well above the copy, ie. it's not pushing your text down. The issue is actually the cell with the white copy in it.
I added a line height to the cell and removed the border-collapse:collapse; (you don't need it on individual cells. You may just want to double check your superscripts are all good.
This was the result:
Hope that helps.