Jun 21, 2008

Embedded CSS Fixer for HTML Email

For those of you who code your own HTML email, you probably know that CSS isn’t fully supported in all the different email programs.

Embedded CSS often breaks in webmail apps like Gmail and YahooMail. In order to make it work properly, you have to turn it all into inline CSS. Besides making you feel dirty all over, inlining your CSS in HTML email is just plain tedious.

So we made it automatic in MailChimp.

Details and a demo video after the jump…

And it does some other cool stuff…You can go nuts with some pretty sophisticated CSS coding (including attribute, pseudo-classes, descendants, and more), and we’ll sort it all out automagically and turn it into code that all the major email programs will display properly.More specifically, here are the different selectors supported:

  • tagname
  • class
  • has attribute
  • attribute value equals
  • attribute value is one of
  • attribute value contains
  • attribute hyphen value
  • attribute value begins with
  • attribute value ends with
  • pseudo-classes first-child
  • last-child
  • only-child
  • empty
  • not
  • nth-child
  • child
  • descendant
  • sibling

Just a little love for our advanced code monkeys.