I know that I have to use inline CSS to style anything in an HTML email, but I am noticing an odd override that is occuring in gmail. I am trying to change the color of the text in a table row:
<tr style='color: #000; font-size: 14px; font-family: Verdana, serif;'>
but when I open this email in gmail, the font-family and black color is being overwrote by gmail stylings. I'm seeing this via Firebug:
That purple color is being used instead of the black I want, and the font family is defaulting to arial,sans-serif. Does anyone know of a way to safely override the styling that gmail is forcing on me?
UPDATE
I changed the color to a non-black color, i.e. #212a2c and the color changed correctly, but the font-family is still stuck on arial.
Double tap the text you want to format. Tap Format, then choose a formatting option like bolding, italics, or changing the font color.
To set the font color in HTML, use the style attribute. The style attribute specifies an inline style for an element. The attribute is used with the HTML <p> tag, with the CSS property color. HTML5 do not support the <font> tag, so the CSS style is used to add font color.
Hover your cursor over the label's name in the left column. Click on the three dots to the right of the label's name. Hover over on “Label color.” Select the color you want to assign to that label — you can either choose a basic color combination or create custom colors for the background and text.
Under Compose messages, choose Stationery and Fonts. On the Personal Stationery tab, under New mail messages or Replying or forwarding messages, choose Font. In the Font box, choose the font, style, size, and color that you want to use. You can see a preview of your changes as you make them.
It looks like you are styling the TR but gmail is over riding it with a style to the TD. When a TD and a TR conflict, the TD will win because it is the most immediate container...the closest match as per css3 rules. I think if you use inline style on your TD you will be able to over ride it.
From experience I have found the safest thing to do with color codes is always to use the 6 number code - I had a similar problem once and it was fixed simply by changing the color code from 3 digits to 6 - it doesn't take any time at all to type 3 extra numbers after all :)
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With