Outlook 2010, Windows 7 and the Display Debacle

Anyone who designs and codes emails for the masses is familiar with the challenge Microsoft Outlook provides. Its rendering engine alone forces designers to go against web standards to achieve accurate results. No big deal, it’s been a problem for years and there are already hundreds of blogs and a website addressing the issue.

However, this week I came across a new issue where fonts in HTML emails were being enlarged in Outlook 2010. The email looked pristine in all the other clients, but appeared wonky (technical term) in Outlook. I compared the screenshot from the client with our tests and noticed the font-size on their email was 15px when it should have been 12px. After working through the normal problem spots with no luck and exhausting several forums I knew there was only one way to fix this problem. One-on-one time with a PC.

Problem

I went through all the Outlook settings to no avail, but when I checked the Control Panel I found the fix. Under Control Panel > Appearance and Personalization > Display there is a setting that says “Make it easier to read what’s on your screen.” The real title should be “We assumed you’d want larger text, so we inadvertently jacked up your email,” but I digress. When I changed the setting from Medium to Smaller everything was fixed. I actually heard a choir sing.

Now I could rant for a good day about the default setting being Medium when Smaller is actually 100%, but nobody really wants to hear that and I think it kinda mocks itself. The important part is the email’s fixed and I’m back on a Mac.

If you’re experiencing the same issue, I’ve given you screenshots to guide you through:

Appearance

Display

Select Smaller

3 comments

PMcKern I've actually had the problem where people going from "smaller" to "medium" resulted in the pixel-based sizes getting rendered SMALLER than they were supposed to (my 13px body text became 8.5pt). Table cell widths are similarly abused, pixel widths being inaccurately changed to narrower point-based widths. I've "fixed" it by switching to percentage-based sizing, which unfortunately transfers the problem to Apple Mail, Hotmail, Gmail, and Yahoo users, where the text is rendered too small. I'm now looking to see if I can do anything to help that using a base font size setting.... The table width thing I have only fixed with using spacer images as struts to prop open the width, going primitive with it. Mon, Jan 23, 2012 6:14pm
@xthomasx Same issue happens in iOS mail. There's CSS code to fix it. Wonder if there's code for Outlook. Thu, Oct 20, 2011 10:43am
@thumbslinger put w/in a font tag. All Outlooks will read the inline css. Sat, Oct 22, 2011 1:08am

Share your thoughts

Comments are closed for this entry.

IE 6

We're sorry...

The browser you're using is not supported, and we strongly suggest that you upgrade.

We recommend using Firefox or Chrome.