What is the best way (CSS/Tables/Inline Styles/External Stylesheets) to format an email?

Question

I'm planning on composing HTML mail for a mailing list. How should I format it? The two dichotomies I've contemplated are:

• CSS, specifically, aligned divs, versus tables for layout
• Inline styles style="width: 60%" versus external stylesheets

What is the going best practice or give me some war stories regarding email formatting?

Answer 1

The Email Standards Project is a great resource for information regarding formatting emails.

Answer 2

This article is great starting point. http://articles.sitepoint.com/article/code-html-email-newsletters

Basically you use tables for structure. Use CSS inline styles instead of external. Use a table for your container, and then make another table inside that table for each section, like header, content, footer. Think of emails as if you were coding a decade ago. :)

Answer 3

An important aspect would be whether your readers will be able to read email off-line (as in a Blackberry AFTER the message is downloaded, while you are on a plane). The CSS would need to be cached for it to work. If you append the entire style within the mail, it would be self contained (no connection needed).

Just a tought.

Answer 4

<style> tags are stripped by some email sites (I think either Gmail or Yahoo). Inline styles seem to work, but keep in mind, Outlook and Thunderbird both aren't standards compliant at all, and random things may be stripped out by different clients. It's worse than writing a website for IE6..

EDIT: Oh, and be careful with however you do your layout because float and position may also be stripped. Honestly, I recommend tables.

One more edit: Apparently Thunderbird has gotten better since I last tried to use it. Still, don't expect too much from it..