CODEWITHSUNDEEP
outlookhtml-emailoutlook-2007
Rob N
Rob N

Reputation: 16429

When Outlook 2007 ignores css, how to specify font-size?

I have two Windows computers, both with Outlook 2007. I send both an HTML email with stuff like:

<div style='font-family:Times New Roman,Serif;font-size:11pt'> ...

I need it to be Times New Roman, 11pt font. In one Outlook it shows up correctly as Times 11pt, in the other, Arial 12pt. I can get the second one to display Times by using surrounding content with a tag like:

<font face='Times New Roman' size='3'>...

But the size is mapped to 12pt, and size=2 is 10pt. I see no way yet to specify the size in px or pt. This tag is disturbing because we're in the year 2013.

I understand that Outlook HTML email rendering is a disaster because it defers to Word instead of IE for rendering. But why the difference? And can I do something to get the second copy of Outlook to act like the first one? Or is there some other way to tell it: "11pt".

Here is my most recent attempt at the HTML sent to Exchange...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"   
  "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <style>
      body, div, p, table, td {
         font-family:TimesNewRoman, "Times New Roman", Times, Serif;
      }
    </style>
  </head>
  <body style='font-family:TimesNewRoman, "Times New Roman", Times, Serif;font-size:11pt;'>
   <font style="font-family: TimesNewRoman, "Times New Roman", Times, serif; font-size: 14px; color: #000000;">
    <p>Blah blah.
    </p>
   </font>
 </body></html>

Upvotes: 4

Views: 14830

Answers (2)

cc8080
cc8080

Reputation: 86

I had a similar problem, but I only have Office 2010, so I can't verify that this would work for 2007. In case it helps, I've shared the basic structure of my HTML for Outlook messages below. The key differences I see from the original question are the style type "text/css" and the enclosing comment tags around the styles. Note that other elements, like td, th, table, etc., can be styled in this block as well.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>My Title</title>
<style type="text/css">
<!--

body { font-size: 10pt font-family: sans-serif; }

-->
</style>
</head>
<body>
blah, blah
</body>
</html>

Upvotes: 3

John
John

Reputation: 12193

Times isn't a font in Windows (I believe that is the Mac name for Times New Roman).

Courtesy of cssfontstack, Try something like this:

font-family: TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif;

Beyond this try using the quotation marks fallback in the example above to see if that makes a difference. Also, apply your css styles to a <font> tag or a <td> directly. Div's are not really recommended for html email, so I'd avoid them wherever possible. I use font tags almost exclusively to style text and they always seem to come through for me.

Upvotes: 2

Related Questions