"Update your preferences"
Bootstrap 4.1.1 Snippet by csshint

Post to Facebook Tweet this

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.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" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta content="yes" name="apple-touch-fullscreen" /> <meta name="apple-mobile-web-app-status-bar-style" content="black" /> <meta name="format-detection" content="telephone=no" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <title>Archant Subscripions</title> <style type="text/css"> a:link {text-decoration: none;} a:visited {text-decoration: none;} a:hover {text-decoration: none;} a:active {text-decoration: none; text-align: center;} /*these are fixes from htmlemailboilerplate.com */ /* Outlook link fix */ #outlook a { padding:0; } /* Formatting */ body{ width:100% !important; -webkit-text; size-adjust:100%; -ms-text-size-adjust:100%; margin:0; padding:0; background-color: #DEDEDE; } .ReadMsgBody { width: 100%; } .backgroundTable {margin:0 auto; padding:0; width:100%;!important;} table td {border-collapse: collapse;} /* Hotmail background & line height fixes */ .ExternalClass {width:100% !important;} .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;} /* Image borders & formatting */ img { outline:none; text-decoration:none; -ms-interpolation-mode: bicubic;} a img {border:none;} /* Re-style iPhone automatic links (eg. phone numbers) */ .applelinks a { color:#FFFFFF; text-decoration: none;} /* Hotmail symbol fix for mobile devices */ .ExternalClass img[class^=Emoji] { width: 10px !important; height: 10px !important; display: inline !important;} a { color:#006699;} /* Outlook 2013 spacing fix */ table td { border-collapse:collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt;} } </style> </head> <body style="Margin:0;padding-top:0;padding-bottom:0;padding-right:0;padding-left:0;"> <center class="wrapper" style="width:100%;table-layout:fixed;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;"> <div align="center"> <table width="100%" height="100%" align="center" cellpadding="0" border="0" cellspacing="0" style="Margin:0 auto;width:100%;"> <tr> <td bgcolor="#DEDEDE" valign="top" align="center" style="background-position: top center"> <table width="600" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="300" height="10"></td> <td width="300" height="10"></td> </tr> <tr> <td width="300" height="26" align="left"> <a href="#" target="_blank" style="font-size: 11px; font-family: Arial, Helvetica, sans-serif; text-decoration: none; color: #333333; font-weight: bold">Can't see the images? <u>Click here</u> </a> </td> <td width="300" height="26" align="right"> <a href="#" target="_blank" style="font-size: 11px; font-family: Arial, Helvetica, sans-serif; text-decoration: none; font-weight: bold; color: #333333;">Send to a friend</a> </td> </tr> <tr> <td width="300" height="10"></td> <td width="300" height="10"></td> </tr> </table> <table width="600" border="0" align="center" bgcolor="#FFFFFF" cellpadding="0" cellspacing="0"> <tr> <td height="30" align="center" valign="top"></td> </tr> <tr> <td> <table width="540" bgcolor="#57BFBA" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td height="50" align="center" valign="top"></td> </tr> <tr> <td height="90" align="center" valign="top"> <a href="#" target="_blank"> <img src="http://www1.archantmail.com/Yogip/eshot_ArchantB2C_v5/HTMLUpload/Images/EHID-337/0b4b842dd5024d859468d2cde079cc10.jpg" width="400" height="167" border="0" /> </a> </td> </tr> <tr> <td height="180" align="center" valign="middle" style="font-size: 18px; font-family: Helvetica, Arial, sans-serif; text-decoration: none; color:#FFFFFF; padding-left: 20px; padding-right: 20px"> <span style="font-weight: bold; font-size: 20px">We're having a spring clean of our email data! </span> <br />We want to make sure that you receive communications from Archant that are interesting and relevant to you. If you would still like to receive emails from our various titles then please take a few seconds to update your email marketing preferences</td> </tr> <tr> <td height="50" align="center" valign="middle" style="font-size: 30px; font-family: Arial, Helvetica, sans-serif; text-decoration: none; font-weight: bold; color:#000013;"> <a href="#" target="_blank"> <img src="http://www1.archantmail.com/Yogip/eshot_ArchantB2C_v5/HTMLUpload/Images/EHID-337/23a20dcfd82c4402922013b19b3abee7.jpg" width="500" height="382" border="0" /> </a> </td> </tr> <tr> <td height="20" align="center" valign="top"></td> </tr> </table> <table width="540" bgcolor="#57BFBA" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="107" height="50" align="right" valign="middle" style="font-size: 21px; font-family: Helvetica, Arial, sans-serif; text-decoration: none; color:#FFFFFF;">Click</td> <td width="74" align="center" valign="middle"> <a href="www.csshint.com" target="_blank"> <img src="http://www1.archantmail.com/Yogip/eshot_ArchantB2C_v5/HTMLUpload/Images/EHID-337/994bc6add4234743bbaf93bae01b8fe7.jpg" width="56" height="60" border="0" /> </a> </td> <td width="359" align="left" valign="middle" style="font-size: 21px; font-family: Helvetica, Arial, sans-serif; text-decoration: none; color:#FFFFFF;">to check your <strong>FREE</strong> subscriptions</td> </tr> </table> <table width="540" bgcolor="#57BFBA" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td height="30" align="center" valign="top"></td> </tr> </table> </td> </tr> <tr> <td height="30" align="center" valign="top"></td> </tr> </table> <table width="600" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td height="10" align="center" valign="middle"></td> <td height="10" align="center" valign="middle"></td> </tr> </table> </td> </tr> </table> </div> <div style="display:none; white-space:nowrap; font:15px courier; color:#ffffff;">- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -</div> </center> </body> </html>

Related: See More

Light Bootstrap Dashboard
Update Cards
User preferences in Nav Bar

Questions / Comments: