CSS for mail doesn't apply?

I have no idea what's going 开发者_如何学JAVAon now. I threw together a simple page with very simple CSS. I used tables cause i know you can't use div elements like normal for emails. So after viewing it in my browser, it looks like this:

http://i.stack.imgur.com/8FBtf.png

And after sending it through mail (the cells data has been replaced):

http://i.stack.imgur.com/tuXvA.png

So the CSS doesn't apply at all!

Here's the HTML and CSS:

http://pastebin.com/PySeeW4m

Any ideas?

Most e-mail clients only read the CSS if it is provided inline through style= tags, Mailchimp provides a great tool to do this automatically:

CSS Inliner Tool

CSS in e-mail is only partially supported and support differs greatly amongst clients. Have a look at http://www.campaignmonitor.com/css/ You probably need to have all CSS inline for more compatibility.

please consider that f.i. gmail strips out style definitions from the HTML template. You can use a workaround and include style information direct in the element like this

<div style="width:150px">...</div>

To use your css like it is right now just use a css parser and attach it to the elements via a regular expression

Regards