Last active
December 13, 2015 22:29
-
-
Save andyhoman/4984934 to your computer and use it in GitHub Desktop.
My HTML email boilerplate. Generated by combining the following boilerplates: http://www.emailology.org/ and http://htmlemailboilerplate.com/
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!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"> | |
| <head> | |
| <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"/> | |
| <title>Your Message Subject or Title</title> | |
| <style type="text/css"> | |
| #outlook a {padding:0;} | |
| body{width:100% !important; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; margin:0; padding:0;} | |
| body, #body_style { | |
| background:#FFFFFF; | |
| min-height:1000px; | |
| color:#333333; | |
| font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
| font-size:13px; | |
| margin-top:0; | |
| margin-bottom:0; | |
| margin-right:0; | |
| margin-left:0; | |
| padding: 0; | |
| width:100% !important; | |
| -webkit-text-size-adjust:100%; | |
| -ms-text-size-adjust:100%; | |
| } | |
| .ExternalClass {width:100%;} | |
| .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;} | |
| #backgroundTable {margin:0; padding:0; width:100% !important; line-height: 100% !important;} | |
| img {outline:none; text-decoration:none; -ms-interpolation-mode: bicubic;} | |
| a img {border:none;} | |
| .image_fix {display:block;} | |
| p {margin:0; padding:0; margin-bottom:0; margin-top: 0;} | |
| h1, h2, h3, h4, h5, h6 {color: #333333 !important; line-height: 100%;} | |
| h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {color: #333333 !important; text-decoration: none;} | |
| table td {border-collapse: collapse;} | |
| table { border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; } | |
| a, a:link {color: #f27a24; text-decoration: underline;} | |
| </style> | |
| </head> | |
| <body> | |
| <table cellpadding="0" cellspacing="0" border="0" id="backgroundTable" bgcolor="#FFFFFF"> | |
| <tr> | |
| <td> | |
| <table cellpadding="0" cellspacing="0" border="0" align="center" bgcolor="#FFFFFF"> | |
| <tr> | |
| <td width="200" valign="top">test</td> | |
| <td width="200" valign="top">test</td> | |
| <td width="200" valign="top">test</td> | |
| </tr> | |
| </table> | |
| <!-- Yahoo Link color fix updated: Simply bring your link styling inline. | |
| <a href="http://htmlemailboilerplate.com" target ="_blank" title="Styling Links" style="color: orange; text-decoration: none; margin-top:0;">Coloring Links appropriately</a> | |
| <img class="image_fix" style="display: block;" src="full path to image" alt="Your alt text" title="Your title text" border="0" width="x" height="x" /> | |
| <span class="mobile_link">123-456-7890</span>--> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- End of wrapper table --> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment