htmlcssemailemail-templates

Building HTML emails, can I put styles in the header section or do I have to use inline styles?


I have to build some email templates using basic HTML and CSS.

I have found this page which details which CSS styles are most supported in various email clients. I understand these will work as inline styles. However I'd like to put them in the head section of the email as it will be a bit cleaner, can I do that as well and will it be well supported? E.g.

<!DOCTYPE html>
<html>
    <head>
        <style type="text/css">
           /* CSS goes here */
        </style>
    </head>
    <body>
        Email goes here
    </body>
</html>

Many thanks!


Solution

  • The article Using CSS and HTML in Email Newsletters by Groundwire Labs will help you:

    1. Do not rely on external (<link rel="stylesheet">) or embedded style sheets (those contained within the <style> tag above the <body> tag). This is the most important thing to avoid. Many email services cut everything above the body tag and disable external style sheets. That said you can include a few embedded CSS statements (such as link color) as long as you're ok with them not rendering in some email clients.