Guide to CSS support in email clients

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 email 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 23 email clients across the desktop, web and mobile email world, download the complete guide in PDF format.

 

 
CSS Header
Style Element
<style> in <head>  
<style> in <body>  
                         
Link Element
<link> in <head>  
<link> in <body>  
 
Selectors           
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]  
 
  CSS Head
Text & Fonts
direction  
font  
font-family  
font-style  
font-variant  
font-size  
font-weight  
letter-spacing  
line-height  
text-align  
text-decoration  
text-indent  
text-transform  
white-space  
word-spacing  
vertical-align  
 
Color & Background
color  
background  
background-color  
background-image  
background-position  
background-repeat  
 
 
CSS Head
Box Model
border  
height  
margin  
padding  
width  
 
Positioning & Display
bottom  
clear  
clip  
cursor  
display  
float  
left  
opacity  
overflow  
position  
right  
top  
visibility  
z-index  
 
Lists                        
list-style-image  
list-style-position  
list-style-type  
 
Tables                        
border-collapse  
border-spacing  
caption-side  
empty-cells  
table-layout  
Total Market Share 32% 15%
15%
6% 5% 5% 5% 2% 2%  

 


Try it


Top

Contact UsAnti-Spam PolicyTerms of UsePrivacy PolicySitemap

Bookmark and Share