...
PDA

Email and CSS

FuZion
05-08-2008, 01:58 AM
Hi there,

Can someone please tell me why Gmail wont read my HTML email correctly?

Here is the HTML.. thanks!

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css" media="screen">@import "http://www.midwestfleet.com/include/email.css";</style>
</head>
<body>

<div id="pageContainer">
<div id="headerContainer">
<h1>Midwest Fleet Services</h1>
<div id="logo">

</div>
</div>
<div id="bodyContainer">
{BODY}
</div>
</div>
</body>
</html>
VIPStephan
05-08-2008, 02:04 AM
There are many tutorials about creating HTML e-mails. The first rule of thumb is: forget everything you’ve learned about semantics and CSS layouts. Tables are the way to go.

I’ve read a pretty good article but I can’t remember where I found it. But basically it said that Gmail strips out all divs and external CSS. You’ll be better of using good ol’ tables and out CSS as inline styles into every element you need to style (even if it means that you have to repeat it a million times to style each table cell).
Lochlan
05-08-2008, 03:00 AM
Yep, inline CSS is the way to go for emails. It has to be set for every element, as in, don't expect properties to inherit. Awesome guide here: http://www.anandgraves.com/html-email-guide
FuZion
05-09-2008, 02:48 AM
Alright thanks for your help guys, the table is working better I believe. But it doesn't like my CSS.. any idea whats wrong?

Thanks again for the help!

<table width="650">
<tr style="font-family: Arial; width: inherit; height: 70px; color: #FFFFFF; margin-right: auto; background: #fff url(http://midwestfleet.com/images/top11.jpg) repeat-x top;">
<td width="550"><h1>Midwest Fleet Services</h1></td>
<td>LOGO IMAGE</td>
</tr>
<tr>
<td style="width: inherit; font-family: Arial; font-size: 13px; color: #454545;" colspan="2">
{BODY}
</td>
</table>

EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum