<h1> - <h6> Tags Rendered as Green Font in Email Newsletters

html css header tags dreamweaver
TheGreatBenigma picture TheGreatBenigma · Apr 28, 2012 · Viewed 9.3k times · Source

I'm designing an email in Dreamweaver with inline CSS, but every test I make, with Hotmail in Firefox and Chrome always renders header tags as a green font color. I want the font to be normal. Nothing will change it. Why is <h1>-<h6> rendered as a font color?

<div class="blockheader">
    <h2>New event starting today!</h2>
</div>

<style>
#block .blockheader {
    background-color: #000;
    color: #FFF;
    font-family: "Arial Black";
    display: block;
    text-align: left;
    padding: 2px 0px 2px 0px;
}
</style>

Answer

Sampson picture Sampson · Apr 28, 2012

When writing HTML/CSS for emails, you tend to have to pretend you're going back in time. Meaning, write very basic markup, and use inline styles:

<h1 style="color: #FFF; background: #000">Foo Email</h1>

Additionally, check out the HTML Email Boilerplate. You may also find the Inline Styler to be of help too.

Related questions

HTML/CSS--Creating a banner/header

I've got a horizontal image as a GIF and JPG. It is something I made with Paint--a text logo with an image on a solid background. I am having a lot of trouble trying to get it to display as …

Read More
Removing newline after <h1> tags?

I am having a problem with removing linebreaks after the <h1> tag, as everytime it prints, it adds a line break straight after it, so something like <h1>Hello World!</h1> <h2>…

Read More
Fixed header table with horizontal scrollbar and vertical scrollbar on

I have been trying to figure out this problem i have with html/css sticky header + scrollbars. We are creating a program that requires scrollbars to show up once the containersize reaches a certain point(depending on resolution of the …

Read More