HTML rendering in Outlook 2010 and Gmail
Question
I am programmatically sending a full HTML message to 2 persons... 1 is a Gmail user and the other is a private host using Outlook... the message is the following:
<html xmlns="http://www.w3.org/1999/xhtml\">
<body background="http://sa-tips-spint1:103/_layouts/images/corrente%20do%20bem/2010/cartao.jpg" BGCOLOR="#000000" style="background-position: center top;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;">
<div align="center">
<p> </p>
</div>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<table width="827" height="69" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="504"> </td>
<td width="323" valign="top">
<p style="color:'#FFFF66';font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 12px;">Ola,</p>
<p style="color:'#FFFF66';font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 12px;"> MY HAPPY MESSAGE </p>
</td>
</tr>
</table>
</body>
</html>
the problem with the Gmail... is that the image does not show up and the background does not apply and no kind of CSS is applied... leaving only the MY HAPPY MESSAGE...
and the problem with the Outlook is that if i use css... css does not render properly... all css except the background-image... can anyone help me?
2 answers
solution1
1 ACCPTED 2010-12-06 19:11:21
As you can see from this Answer in SO . Gmail blocks images by default. You can't do anything about it as a sender.
solution2
0 2010-12-06 19:42:19
All modern mail readers disable images and other external references by default. They will stay disabled until the user enables the images for the one message or tells the reader program to always enable images when receiving from that account. It's usually a good idea to just respect this and not provide external references if you don't absolutely have to.
The only way around this that I am aware of is if you actually embed the image in the email itself. In other words, the entire message becomes self contained.
Also, most email applications (especially web based ones) strip out the HTML, HEAD, and BODY tags. If you think about it you'll understand why. If you really need a background image, move that image to a div just inside the body. Like <body><div style="...">CONTENT</div></body>
One final note because those outer tags are removed, you should move any CSS classes to be below the BODY tag.
The main thing to take away from this is that you will have to break a lot of standardization rules in order to get HTML email to work. finally, you might read this link from Ros Hodgekiss. It's a relatively new post that talks about gmail and outlook 07/10; I haven't tested it myself, but it sounds pretty well researched.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.