Trouble getting html email signature to display properly in Outlook
I have created myself a simple email signature in html, he's the code:
<html>
<!-- Company logo goes here -->
<div id="far_left"
style="width: 50px;
height: 50px;
float: left;
margin-right: 10px;">
<img src="logo.png" />
</div>
<!-- Name and occupation goes here -->
<div id="top"
style="height: 25px;">
<span style="font-family: Arial, Verdana, 'Sans Serif'; font-size: 22; color: #464646;"><strong>Dean Grobler</strong>, Programmer</span>
</div>
<!-- Website link and email adress goes here -->
<div id="bottom"
style="font-family: Arial, Verdana, 'Sans Serif';
font-size: 14px;
color: #464646;
padding: 5px;
height: 25px;">
<a href="http://www.deangrobler.com" style="text-decoration: none; color: #84d5f6">www.deangrobler.com</a> |
<a href="mailto:[email protected]" style="text-decoration: none; color: #84d5f6">[email protected]</a>
</div>
In thunderbird, and my browsers it displays correctly:
But alas in Outlook 2010 it does not:
If it's using the same rendering engine that IE uses, and I bet you it does, I'm not too surprised this is happening.
Any ideas?
Answer
Email clients do not render html in the same way that browsers do. When creating html emails it is much better to use tables. I know this is going against all modern web design, but they are supported by a lot more email clients. Here is a link to the css properties and which clients they are supported by.