Skip to content

Instantly share code, notes, and snippets.

@dragstarcrowant
Last active December 14, 2015 21:19
Show Gist options
  • Save dragstarcrowant/5150148 to your computer and use it in GitHub Desktop.
Save dragstarcrowant/5150148 to your computer and use it in GitHub Desktop.
GUIDE: edm
<body style="margin:0; padding:0; background:#ffffff;">
<!-- <table> always with fixed width -->
<!-- in case having problems with different <td> width, <table> "table-layout" must be changed to "fixed", this will "lock" column width and content won't break layout -->
<table style="width:600px; margin:0 auto; border-collapse:collapse; border-spacing: 0; border:none; " cellspacing="0" cellpadding="0" border="0">
<tr style="border-spacing:0; padding:0; margin:0; border:0;">
<!-- <td> must have at least one set dimension: <td style="width:..px;" width=".."> or <td style="height:..px;" height=".."> -->
<!-- <td> can be used like placeholder or spacer(instead of paddings or margins)
<td colspan="" style="border:0; background:#5e9525; text-align:center; margin:0; width:19px; vertical-align: top; padding:0; border:none; height:50px;" width="19" height="50">
</td>
<tr>
</table>
</body>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<title></title>
<style type="text/css">
/* reset css for all client */
.ReadMsgBody {width: 100%;}
.ExternalClass {width: 100%;}
body {background:#ffffff;padding:0;margin:0;}
a{text-decoration: none;}
a:hover{text-decoration: none;}
p {margin-bottom:0; margin:0}
ul{margin: 0;}
ul li{margin: 0;}
/* links fix for yahoo client */
span.yshortcuts { color:#000; background-color:none; border:none;}
span.yshortcuts:hover,
span.yshortcuts:active,
span.yshortcuts:focus {color:#000; background-color:none; border:none;}
/* add custom class to change color or text-decoration. Class must be applied to <a> */
.white-link{color:#fff;}
.white-link span.yshortcuts{color:#fff;}
</style>
</head>
<!-- content tags with important style/attr -->
<img src="" alt="" style="display:block; width:..; height:..; margin: 0; padding: 0; outline:0; border:0;" width=".." height=".."/>
<p style="margin: 0; padding: 0; border:0; text-align: ..;"></p>
<a href="#" style="margin: 0; padding: 0; border:0; outline:0; vertical-align: top; display:block; "></a>
!!!!!!!!!!!!!!! ACHTUNG !!!!!!!!!!!!!!!
for live testing use this instructions:
https://docs.google.com/spreadsheet/ccc?key=0AtkDGWmqDyGFdGtxcEdEcEgwQlVUYmIyRDVIUGp4dVE#gid=0
usefull info about css,alt etc. support:
http://www.campaignmonitor.com/css/
http://ctrlq.org/html-mail/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment