.ExternalClass Fix Isn't Working in Outlook.com
Hi everyone,
First of all thank you for taking the time to read this.
It's important to note that this is a all text sales banner which I make to duplicate sales image for that sweet sweet text ratio.
The issue is pretty apparent when you look at the attachment Outlook.com appears to be adding additional line height or spacing to just this single table row. This is only occuring on outlook.
<tr>
<td width="100%" style="font-family: sans-serif, Verdana Bold, 'Lucida Sans Unicode', Helvetica, Arial, sans-serif; font-size: 96px; color: #ed1c24; text-align: center; mso-line-height-rule:exactly; line-height: 96px; text-align: center; padding:0px;" class="bannerfontbody"><a style="color:#ed1c24" href="http://www.etc.au"><strong>SALE</strong></a></td>
</tr>
Nothing appears to be wrong in the above so it must be the externalclass issue?
It can't be as I have it already.
.ExternalClass {width:100%;} /* Force Hotmail to display emails at full width */
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {mso-line-height-rule:exactly; line-height: 100%;} /* Force Hotmail to display normal line spacing. */
It's fine on every single other client.
Thanks for you help! I've now spent over 6 hours trying various fixes and rebuilds on this and am feeling pretty defeated.
http://oi62.tinypic.com/2i9sgoo.jpg
Cheers,
Luke!
Luke. I know this is an old post. Did you find a solution? I am having an issue with Outlook.com. It strips out my .ExternalClass classes.
Would love to know the solution on this. I'm having the same issue. It has to do with the <br> tags. Outlook adds more space.
The mobile version of Outlook.com does not have an
.ExternalClass
. The only bulletproof way to fix this is to setline-height
on every element immediately preceding text.Example: