
1
Padding Issue with Outlook
Heya!
I'm having an annoying issue on Outlook where it's adding space at the top of my email.
It's about 300-400 px and I've tried valign-ing the containing table to top to no avail.
I was hoping one of you wizard ninjas could help me!
The first link is the space from when Outlook pulls in the image and the second image is the start of the email.
Thank you kindly in advance.
Is there anything above the content that you're using to pad out the top "Problems reading thi..." line from the top of the viewport?
Like a spacer image or empty cell?
Hi Niven, I do have a spacer to force the width of the email in gmail I've pasted from the body tag to the end of the table. Min and max width wasn't on the spacer image before. Do you think that's what's causing it to break?
<body bgcolor="#ededed" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" style="margin:0; padding:0;-webkit-text-size-adjust:none; -ms-text-size-adjust:none;">
<table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="center" valign="top">
<table bgcolor="#ededed" width="650" class="email-container" border="0" cellspacing="0" cellpadding="0">
<tr>
<td style="font-size:1px; line-height:0; mso-margin-top-alt:1px;"><img class="BlankGmail" style="width:600px; height:2px; min-height:2px; max-height:2px; border: 0; padding: 0; display: block; min-width:600px" src="http://www.ade-lee.com/Files/spacer.png" height="2" alt=""></td>
</tr>
<tr>
<td align="center" style="color:#000001; padding:10px; font-size:12px; font-family:Proxima Nova, Monstratt, Helvetica, Arial, sans serif;">
<font face="'Proxima Nova', Monstratt, Helvetica, Arial, sans serif">
<strong>Problems reading this email? Click here to view in browser</strong>
</font>
</td>
</tr>
Have you tried removing the "height=100%" from the container table? It could be that Outlook is misinterpreting it.
Also, what's your CSS for the "email-container" class? Something within that CSS could also be causing problems.
I'd firstly try adding these resets to all of your tables: style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"
Then, remove the <font face="'Proxima Nova', Monstratt, Helvetica, Arial, sans serif"> code wrapping your text. This isn't needed. Instead, in your styles at the top simply wrap your font face tags in a media query without any sizes. ( So just @media { } ) - This will stop Outlook from reverting your fonts to Times.
See if those changes work!