Download the
complete guide
(PDF - 105 KB)Download the
complete guide
(Excel - 53 KB)Full report on all 24
clients
Campaign Monitor - Home
Features
Pricing
Customers
Resources
Support
Our Story
Blog
Sign Up
Login
Create an Account
Tips & Resources
›
Designing and building emails
Designing an HTML email that renders consistently across the major
email clients can be very time consuming. Support for even simple CSS
varies considerably between clients, and even different versions of the
same client.
We’ve put together this guide to save you the time and frustration of
figuring it out for yourself. With 23 different email clients tested, we
cover all the popular applications across desktop, web and mobile
email.
As the number of email clients continues to grow, we’ve decided to
simplify the web-based version of the guide to focus on the
10 most
popular
email clients on the market. For the complete report on all 24
email clients across the desktop, web and mobile email world,
download
the complete guide
in PDF format.
Style Element Outlook2000/03 HotmailLive Yahoo!Mail ClassicYahoo! Outlook2007/10 AppleMail iPhoneApple GoogleGmail Note s 6/7Lotus Note s 8.5Lotus De sk 10AOL <style> in <head>
<style> in <body>
Link Element Outlook2000/03 HotmailLive Yahoo!Mail ClassicYahoo! Outlook2007/10 AppleMail iPhoneApple GoogleGmail Note s 6/7Lotus Note s 8.5Lotus De sk 10AOL <link> in <head>
Selectors Outlook2000/03 HotmailLive Yahoo!Mail ClassicYahoo! Outlook2007/10 AppleMail iPhoneApple GoogleGmail Note s 6/7Lotus Note s 8.5Lotus De sk 10AOL e * e.className e#id e:link e:active, e:hover e:first-line e:first-letter e > f e:focus e+f e[foo]
Text & Fonts Outlook2000/03 HotmailLive Yahoo!Mail ClassicYahoo! Outlook2007/10 AppleMail iPhoneApple GoogleGmail Note s 6/7Lotus Note s 8.5Lotus De sk 10AOL direction font font-family font-style font-variant font-size font-weight letter-spacing line-height text-align text-decoration text-indent text-overflow CSS3 text-shadow CSS3 text-transform white-space word-spacing word-wrap CSS3 vertical-align
Color & Background Outlook2000/03 HotmailLive Yahoo!Mail ClassicYahoo! Outlook2007/10 AppleMail iPhoneApple GoogleGmail Note s 6/7Lotus Note s 8.5Lotus De sk 10AOL color
background -moz-background CSS3 -webkit-background CSS3 background-color background-image background-position background-repeat -khtml-background-size CSS3 -moz-background-size CSS3 -o-background-size CSS3 -webkit-background-size CSS3 HSL Colors CSS3 HSLA Colors CSS3 Opacity CSS3 RGBA Colors CSS3
Box Model Outlook2000/03 HotmailLive Yahoo!Mail ClassicYahoo! Outlook2007/10 AppleMail iPhoneApple GoogleGmail Note s 6/7Lotus Note s 8.5Lotus De sk 10AOL border -moz-border-color CSS3 -moz-border-image CSS3 -moz-border-radius CSS3 -webkit-border-radius CSS3 -moz-box-shadow CSS3 -moz-box-sizing CSS3 height margin padding width
Positioning & Display Outlook2000/03 HotmailLive Yahoo!Mail ClassicYahoo! Outlook2007/10 AppleMail iPhoneApple GoogleGmail Note s 6/7Lotus Note s 8.5Lotus De sk 10AOL bottom clear clip cursor display float left
opacity outline CSS3 overflow position resize CSS3 right top visibility z-index
Lists Outlook2000/03 HotmailLive Yahoo!Mail ClassicYahoo! Outlook2007/10 AppleMail iPhoneApple GoogleGmail Note s 6/7Lotus Note s 8.5Lotus De sk 10AOL list-style-image
list-style-position
list-style-type
Tables Outlook2000/03 HotmailLive Yahoo!Mail ClassicYahoo! Outlook2007/10 AppleMail iPhoneApple GoogleGmail Note s 6/7Lotus Note s 8.5Lotus De sk 10AOL border-collapse
border-spacing
caption-side
empty-cells
table-layout
Total Market Share 28% 16% 14% 9% 8% 7% 6% 1% 1%
Version History
Updated to reflect margin support in Windows Live Hotmail. Also introducing improved support for @media queries and shorthand CSS.
Discuss this on our blog.
Updated the guide with the results of our CSS3 email client tests. 21 new properties were added, with varying levels of support observed across the popular email clients. Notably, Webkit clients were big winners, including Apple Mail, iPhone Mail and soon, the iPad. At this stage, CSS3 is recommended for decorative purposes in email (such as adding text-shadow), due to poor support for layout and box-model properties.
Discuss this on our blog.
Added test results for the just launched MySpace Mail.
Discuss this on our blog.
10 December
2010
22 April 2010
web-based version of the guide now features the 10 most popular email clients, while the PDF guide includes all 23 email clients tested.
Discuss this on our blog.
Replaced .Mac results with MobileMe.
Discuss this on our blog.
We increased the number of clients we tested, 21 in total now. Gmail and Outlook 2007 continue to be our primary focus since CSS support continues to be limited.
Positive signs from Microsoft though, Entourage 2008 was released with significantly better CSS support.
Discuss this on the blog
Outlook 2007 was released with less CSS support than Outlook 2003. A major step back for HTML email design. New Yahoo! mail was released with better support for CSS, a positive sign to say the least! Windows Live Mail replaced Hotmail and nixed some CSS support in the process.
Read the report
This was our original test. We added Windows Live Mail for the first time and ran through tests on Outlook 2003, AOL 9, Lotus Notes and Eudora.
Read the report