A guide to CSS support in email: 2008 Edition
Posted by Travis Bell on June 11, 2008
In the last year, we’ve seen some changes in the email client market. Webmail usage continues to grow significantly while new versions of popular desktop clients have been released. In an attempt to stimulate some improvement on the CSS front, we’ve helped launch the Email Standards Project.
While we can hope for future improvements, it’s the present we need to design for. The time has arrived to again poke and prod the major email clients to determine just how much (or how little) support they provide for using CSS with HTML emails.
Last year’s report focused on the unique challenges of Outlook 2007. In 2008, Outlook is still an issue, but there are encouraging signs in other areas.
The release of Entourage 2008 (the Mac equivalent of Outlook) made great improvements with CSS support, bringing it on par with Apple Mail’s excellent rendering. Proof that perhaps Microsoft has been listening and we can only hope that the next version of Outlook will follow suit.
Thunderbird 2 was released with plenty of new features, and continued it’s run of excellent CSS support. Gmail has probably been the most disappointing client of all. One of the advantages of web applications is not needing to wait for new versions to be rolled out. With just basic in the head CSS selector support Gmail would go from bad to good but we’re still waiting for that.
Checkout the Email Standards Project post about some support inside Google though, and keep your fingers crossed.
We did expand our testing this year — A combined total of 21 email/web clients making this the biggest test we’ve ever done, up from last years 13.
The CSS support in email guide is permanently located at http://www.campaignmonitor.com/css, and that’s the best page to bookmark to ensure you are always seeing the latest version.
15 comments so far
Search all posts
Dig into a category
- Articles/Tips (129)
- Email Newsletter Design (127)
- Happy Customers/Press (93)
- In the Forums (11)
- Interviews & Case Studies (9)
- New Features & Updates (113)
- Observations & Answers (114)
Stay in the loop
Prefer updates via email? Sign up below and we'll send you all the good bits each month.
Popular articles
Email design guidelines
Straight to the point advice for creating effective emails.
Why we need standards support in email
Read why standards in HTML email are so important, and what we're doing about it.
CSS support in email for 2008
The CSS support of even more popular email environments tested and recorded.
Image blocking in email
A roundup of how each of the popular email clients suppress images in HTML email.
Can I use flash in email?
We test flash support in all the popular email clients. The verdict - don't do it.
Email design gallery
Our email design gallery showcases more than 150 amazing email designs sent by our talented customers.
Morgan Roderick
wrote on June 11, 2008 6:57 PM
Good work guys, you are one of the major catalysts of change in e-mail marketing.
How many times can you say "I love your product and excellent service" before it becomes embarrasing?
Soeren Sprogoe
wrote on June 11, 2008 7:49 PM
Truly amazing and original work.
10 Global Karma points have now been submitted to your account!
Rick Whittington
wrote on June 11, 2008 11:34 PM
An excellent resource -- one that I use at least once per week. Thank you for devoting time to compiling the resource!
Adam
wrote on June 17, 2008 1:27 AM
Is there a list of Html tags that work and don't work in the different email clients?
Sergi
wrote on June 18, 2008 8:20 PM
Astounding!
Dave Greiner
wrote on June 18, 2008 10:43 PM
Adam, we haven't done that particular research as yet, but in our experience almost every tag is support, it's the styling of each tag that's the problem. Unless you're using something obscure like the good 'ole blink tag, you shouldn't have a problem with the tag itself being supported.
Richard Mills
wrote on July 3, 2008 12:16 AM
Really useful. How is the web based clients tested? We have found depending on what browser you use, rarly, can depend on what is supported and how it's displayed. For example, IE6 and FF2 act differently with line-heights. Also see no mention of Lycos (.com and .co.uk) which act differently from each other, nor of NTL World and their 'left' issue of replacing code...
Kris
wrote on July 8, 2008 10:09 AM
How can I float an image where text wraps around it if I can't use a CSS float?
Marc
wrote on July 18, 2008 2:33 AM
Any thoughts about adding a few "mobile client" columns to this terrific matrix? I'm thinking something like: iPhone Mail, BB Mail, Symbia/Nokia Mail, Windows Mobile, your favorite mobile mail client that i'm forgetting.
Robin Houghton
wrote on July 24, 2008 8:19 PM
Looks like Hotmail no longer supports the 'border' property - aaagh! I've become so dependent on borders, this is not even funny. I'm hoping it might be a temporary glitch as I can't find anything about it on the web, Hotmail was behaving oddly yesterday. Fingers crossed.
Jurgen
wrote on August 15, 2008 11:14 PM
I wonder why the overview of the mail clients says that Eudora doesn't support anything. This is absolutely not true. The latest versions of Eudora (last one is 7.1) have very good support for the mentioned tags and styles. The new beta Eudora Penelope (based on Thunderbird) has even a perfect HTML rendering, according to the Email Standards Project site...
Charlie
wrote on August 30, 2008 10:43 AM
It seems that you have an error in your doc (at least, in my testing).
Outlook 2007, from everything I've tested does NOT support padding. This also includes the Windows Live Mail client that you can download.
I've tried the padding on images and divs both and padding does not appear to work for either. It works great everywhere else of course (even live.com), just not Outlook. Pretty frustrating of course...
Jonathan Schofield
wrote on September 15, 2008 11:01 PM
As ever, the 2008 update is a fantastic resource - many thanks!
I'm intrigued though by the distinction you draw between what's safe and what's risky...
Looking at your Excel sheet, you define really useful properties such as background-color, border, font-variant, line-height, padding, text-indent and text-transform as risky, despite support across the board for all the mail clients you've tested except for Notes 6 and Eudora.
You declare color, font-size, font-style, font-weight, text-align and text-decoration as being safe despite Eudora failing on all these as well. The implication is that because these properties are supported by Notes, that elevates them to safe. Is that your yardstick? Can you confirm Campaign Monitor's view on the relative importance of Notes in the scheme of things.
Adrian
wrote on September 19, 2008 2:42 PM
Seems a bit disingenuous for you to be testing Lotus Notes 6 when people are using Lotus Notes 8.
Brady Mills
wrote on October 6, 2008 5:48 AM
font-family appears to work for me with HTML emails in Gmail? Why does the report say it's not supported? Works perfectly. Perhaps you tested something different, that I'm missing.
Got anything to add?