JSFiddle - React, Tailwind, and code Playground
by madhugb
HTML
<html>
<head>
<style>
body { padding: 20px; margin:20px;}
</style>
</head>
<body>
<style>
#outlook a{padding:0;} /* Force Outlook to provide a "view in browser" message */
.ReadMsgBody{width:100%;} .ExternalClass{width:100%;} /* Force Hotmail to display emails at full width */
body, td {-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;} /* Prevent WebKit and Windows mobile changing default text sizes */
table, td {mso-table-lspace:0pt; mso-table-rspace:0pt;} /* Remove spacing between tables in Outlook 2007 and up */
img {-ms-interpolation-mode:bicubic;} /* Help Microsoft platforms smoothly render resized images */
body, #bodyTable, #bodyCell {height:100% !important; width:100% !important; margin:0; padding:0;}
table {border-collapse:collapse;}
body, #bodyTable {
background-color: #F0F0F0;
}
#emailBody {
margin: 0 auto;
width: 600px;
background-color: #FFFFFF;
}
.backgroundColor {
background-color: #F0F0F0;
}
.previewText {
color:#F0F0F0 !important;
}
.logoImage {
border: 0;
border-style: none;
text-decoration: none;
}
.blog-padding {
padding: 30px 30px 30px 30px !important;
}
.footerImage {
border: 0;
border-style: none;
text-decoration: none;
}
.bodyContent {
color:#5F6C72;
font-family:"Open Sans", Helvetica, Arial, sans-serif;
font-size:16px;
font-weight:normal;
line-height:170%;
text-align:left;
}
.bodyContent p {
line-height:170%;
margin: 15px 0;
padding: 0;
}
.bodyContent p a {
color:#499DF3;
}
.bodyContent table td {
font-family:"Open Sans", Helvetica, Arial, sans-serif;
}
.img-max {
max-width: 100% !important;
height:auto !important;
}
...