RB
0
Test issues - Copy not ranging centre in outlook
Hi,
I am running some user experience test and I am finding that the email is not rendering correctly in outlook.
What I am fining is that the images are aligning centre but the copy and text is not.
Code is below. Any help is greatly apprciated.
thanks
in advance
<!DOCTYPE html>
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="format-detection" content="telephone=no">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<style type="text/css">
* {mso-line-height-rule: exactly;}
* {-webkit-text-size-adjust: none;-ms-text-size-adjust: none;}
table td {border-collapse: collapse;}
html, body, p, div {margin: 0;padding: 0;}
.ExternalClass {width: 100%;}
.ExternalClass * {line-height: 110%}
img {-ms-interpolation-mode: bicubic;border: 0;display:block;}
body {margin:0!important; padding:0!important; width: 100%!important;}
</style>
<style type="text/css">
a[x-apple-data-detectors] {color: inherit!important;text-decoration: none!important;font-size: inherit!important;font-family: inherit!important;font-weight: inherit!important;line-height: inherit!important;}
div[style*="margin: 16px 0"] {margin: 0!important;}
</style>
<style>
@media screen and (max-width:600px){
.hide{display:none!important;}
.resize{width:100%!important;height:auto!important;}
.stackup{display:table-header-group;}
.stackdown{display:table-footer-group;}
.text-center{text-align:center;}
.padding10{padding:10px!important}
.font12{font-size:26px!important;}
.stack{display:block!important;width:100%!important}
}
</style>
</head>
<body style="margin:0!important; padding:0!important; width: 100%!important;" bgcolor="white" >
<!-- Save for Web Slices (17-107 EMEA Summer Sizzler EBLAST.psd) -->
<table role="presentation" style="max-width: 600px" width="100%" cellpadding="0" cellspacing="0" align="center" border="0">
<tr >
<td colspan="3" align="center">
<img src="http://s7d5.scene7.com/is/image/ATCross/17-107-EMEA-Summer-Sizzler-EBLAST_01?scl=1&f" width="100%" alt=""></td>
</tr>
<tr align="center">
<td align="center">
<p> <span style="letter-spacing: 4px; valign: center;" align="center"> <font face="arial" color="black" size="5">
<br>
<strong>DON'T FORGET OUR SUMMER OFFERS</strong></font></span></p>
<br>
<p> <span style="letter-spacing: 0px; valign: center;"> <font face="arial" color="black" size="5"> Check them out today!</font></span></p>
<br>
</td>
</tr>
<tr style="max-width: 600px" width="100%" cellpadding="0" cellspacing="0" align="center" border="0">
<td cellpadding="0" cellspacing="0" align="center" border="0" colspan="3">
<img src="http://s7d5.scene7.com/is/image/ATCross/17-107-EMEA-Summer-Sizzler-EBLAST_05?scl=1&f" width="100%" alt=""></td>
</tr>
<tr align="center">
<td align="center">
<p> <span style="letter-spacing: 0px; valign: center;"> <font face="arial" color="black" size="4">
<br>
<strong>CROSS JOURNAL AND PEN GIFT SETS</strong></font></span><br>
</p>
<p> <span style="letter-spacing: 0px; valign: center;"> <font face="arial" color="black" size="3"> Cross Stratford Pen and Cross Journal</font></span><span style="letter-spacing: 0px; valign: center;"><font face="arial" color="black" size="4"><br>
<strong>From £13.58</strong></font></span></p>
<br>
</td>
</tr>
<tr align="center">
<td cellpadding="0" cellspacing="0" align="center" border="0" colspan="3">
<img src="http://s7d5.scene7.com/is/image/ATCross/17-107-EMEA-Summer-Sizzler-EBLAST_09?scl=1&f" width="100%" alt=""></td>
</tr>
<tr align="center">
<td align="center">
<p> <span style="letter-spacing: 0px; valign: center;"> <font face="arial" color="black" size="4">
<br>
<strong>NEW ION FROM SHEAFFER</strong></font></span><br>
</p>
<p> <span style="letter-spacing: 0px; valign: center;"> <font face="arial" color="black" size="3"> Including a lanyard!</font></span><span style="letter-spacing: 0px; valign: center;"><font face="arial" color="black" size="4"><br>
<strong>From £6.49</strong></font></span></p>
<br>
</td>
</tr>
<tr align="center">
<td align="center">
<p> </p>
<p><span style="letter-spacing: 0px; valign: center;"><font face="arial" color="black" size="4"><strong>TO DOWNLOAD THE SUMMER GIFT GUIDE</strong></font></span></p>
<p> <span style="valign: center;"> <font face="arial" color="black" size="4">
<strong> <a href="http://s7d5.scene7.com/is/content/ATCross/Roger/HTML%20Eblasts/Summer%20sizzlers/CROSS%5FSummer%5Fguide%5F2017%5FWS%5FUK%5FSP.pdf" target="new" download="CROSS_Summer_guide_2017_WS_UK_SP.pdf" style="color:black; text-decoration:none">CLICK HERE</a></strong></font></span></p>
<p> </p>
</td>
</tr>
<tr align="center">
<td width="600" align="center" bgcolor="#000000">
<br>
<p> <span style="letter-spacing: 0px; line-height: 20px; valign: center;"> <font face="arial" color="white" size="5">
<strong>CONTACT SARAH COOPER</strong></font></span></p>
<br>
<p> <span style="letter-spacing: 0px; line-height: 20px; valign: center;"> <font face="arial" color="#ebaa00" size="5">
<a href="mailto:scooper@cross.com" style="color: #ebab21;">scooper@cross.com</a> </font></span></p>
<br>
<p> <span style="letter-spacing: 0px; line-height: 20px; valign: center;"> <font face="arial" color="white" size="5">
or call 01582 422 793</font></span></p>
<p> </p>
</td>
</tr>
<tr align="center">
<td align="center">
<p> <span style="letter-spacing: 0px; valign: center;"> <font face="arial" color="black" size="4">
<br>
<strong>*VALID ON ORDERS INVOICED BY 17TH JULY 2017</strong></font></span><br></p>
<br>
</td>
</tr>
</table>
<!-- End Save for Web Slices -->
</body>
</html>
ok I think I have sorted it. Put all elements in their own table. seems to have fixed the issue.