Treble Click: CSS in email: compatibility list

HTML and CSS in emails: compatibility list of email clients

Probably you are familiar with this common scenario: you create a really well designed e-mail newsletter using your most advanced HTML and CSS skills, and then you find out that your recipient's email client is just breaking the whole email design and layout.

While sticking to a very simple plain text email would do the trick, you should not get rid of every HTML design element of your emails just because some mail clients are not compatible with specific CSS or HTML code. The key is to know which HTML and CSS features work on the main email clients.

This email compatibility list is a very useful resource, as it provides graphic examples of how a sample email would be rendered on popular email clients, and it's constantly updated to take into account the latest compatibility improvements of such e-mail clients.

At the present time, this list shows some interesting conclusions, such as that the Gmail mail client would only read inline CSS: Gmail ignores CSS included inside the head element, and removes CSS classes and ID's from the original HTML of the email.

By the way, if you are looking for a reliable free email client application, I would choose Mozilla Thunderbird.

Is there any HTML or CSS that works on any mail client?

So, how could we create appealing e-mails that would work on any e-mail client? The truth is that currently every main e-mail client supports HTML tables with inline background colors defined.

These tables would admit some background images in many e-mail clients. Images are very powerful when they are used to spice up the email body. But don't rely just on images: use elements that would degrade gracefully, so your HTML email would still be readable in any email client.

With no doubt, CSS is the future of HTML in terms of code maintenance and element positioning. But for sending HTML emails, it could be better to stick to a very simple (yet effective) HTML table based email content.

My advice is to use HTML tables in emails: most email clients will render the results flawlessly. And let's keep an eye on the compatibility list of CSS in email clients: the day of fully CSS based emails could be near.