HTML email stretching full width in Outlook 2013 - html

I have an email that works fine in every email client except Outlook 2013. In Outlook 2013 the email stretches full width when it should only be 600px wide.
I've tried searching everywhere for a fix but with no luck!
Here is the code:
<!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.0"/>
<title>Scientific Data</title>
<style type="text/css">
body {width:100% !important;}
.ReadMsgBody { width: 100%;}
.ExternalClass {width: 100%;}
body { margin: 0; padding: 0; -webkit-text-size-adjust: none; -ms-text-size-adjust: none; font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:13px;line-height:18px;color:#666666;}
table td { border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; }
p { margin: 0; padding: 0; margin-bottom: 0; }
ul { margin: 0; }
a, img {border:none;}
.symbolfix img {width:9px !important;height:9px !important;}
a {color:#363636;text-decoration:none;} a {-webkit-tap-highlight-color: rgba(0,0,0,0);color:#006699; !important}
.appleLinks a {color:#666666; text-decoration:none;} /* Stop iOS making times and dates blue */
.ExternalClass * { line-height: 100%; }
#media (max-width:480px) {
table[class="wrapper"], td[class="wrapper"] {width:320px !important;}
table[id="header"]{width:100% !important;}
img[class="banner"], img[class="headercell"]{width:100% !important; height:auto !important;}
img[id="img-280"]{width:280px !important; height:auto !important; padding:0px !important;}
table[id="col-left"],table[id="col-center"], table[id="col-right"]{width:100% !important; height:auto !important; }
table[id="col-one"],table[id="col-two"],table[id="col-full"]{width:100% !important; height:auto !important;}
table[id="col-half"]{width:80% !important;}
td[class="hide"]{display:none !important;}
img[id="small-img"]{width:100% !important; height:auto !important;}
td[id="social-media"]{width:100% !important;padding:30px 0px 20px 0px !important;}
table[id="prod-icons"]{width:25% !important;}
td[id="gutter"]{width:25px !important;}
td[id="gutter-small"]{width:10px !important;}
td[id="break-top"]{border-top:1px solid #cccccc;}
img[id="cont-title"]{width:auto !important; height:50px !important;}
}
</style>
</head>
<body bgcolor="#e7e7e7">
<!-- 100% table -->
<table width="100%" bgcolor="#e7e7e7" border="0" cellspacing="0" cellpadding="0" >
<tr>
<td width="600" align="center" class="wrapper">
<table width="600" bgcolor="#e7e7e7" class="wrapper" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="600" align="center" class="wrapper">
<br />
<!-- wrapper table -->
<table class="wrapper" width="600" bgcolor="#e7e7e7" border="0" cellpadding="0" cellspacing="0" align="center" >
<tr>
<td class="wrapper">
<table class="wrapper" width="600" bgcolor="#e7e7e7" border="0" cellpadding="0" cellspacing="0" align="center" >
<tr>
<td align="center" valign="top" bgcolor="#cdcdcd"><!-- preheader table --> <!-- end of preheader table -->
</td>
</tr>
</table>
</td>
</tr>
<!-- header table -->
<tr>
<td width="600" align="center" class="wrapper">
<table width="600" class="wrapper" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td align="center" valign="top" bgcolor="#274a5c"><img class="headercell" src="http://fastart.nature.com/1989_2015/header.jpg" alt="Scientific Data" width="600" height="84" border="0" style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:18px;line-height:22px;font-weight:bold;color:#b01b22;display:block;" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="600" bgcolor="#ef763d" style="height:10px;font-size:10px;line-height:10px;">
</td>
</tr>
<!-- end of header table -->
<!--Title-->
<tr>
<td width="600" align="center" class="wrapper">
<table width="600" class="wrapper" align="left" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="600" align="left" valign="top" bgcolor="#ffffff" style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif; font-size: 22px; line-height: 28px; color: #363636; padding:30px 20px 20px 20px;"><strong>Scientific Data</em> おすすめのコンテンツ – Epidemiology
</strong>
</td>
</tr>
<!-- end of Title -->
<!--main body-->
<tr>
<td width="600" align="center" class="wrapper">
<table width="600" class="wrapper" align="left" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="600" align="left" valign="top" bgcolor="#ffffff" style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif; font-size: 13px; line-height: 18px; color: #363636; padding:0px 20px 30px 20px;">
<em>Scientific Data</em> は価値のある研究データセットを掲載するオープンアクセスジャーナルです。研究データの広範囲な再利用を促進するとともに、データを公開した研究者にクレジットを与えることを目指します。<em>Scientific Data </em>は科学のすべての領域を対象とし、データのサイズや、研究主体の規模(主要な研究コンソーシアム、研究室、個人単位)に関わらず、投稿を受け付けています。<br /><br />
<em>Scientific Data</em> で出版されるData Descriptors は、科学的なデータセットをくわしく記述する新しいタイプのコンテンツで、公開されたデータを読者が理解しやすく、再利用しやすい形で構成されています。<br /><br />
あなたのご関心分野で、最近特に注目されているData Descriptorを選んでご紹介します。是非ご閲覧ください。また、最新の研究成果をお届けする <em>Scientific Data</em> コンテンツアラートに是非ご登録ください。
</td>
</tr>
</table>
</td>
</tr>
<!-- end of body -->
<!--Button -->
<tr>
<td width="600" align="center" valign="top" bgcolor="#ffffff" style="font-size:0px; line-height:0px;">
<table bgcolor="#ef763d" align="center" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center" valign="middle" style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:16px;line-height:20px;color:#ffffff;padding: 10px;"><strong><a href="http://www.nature.com/nams/svc/myaccount/save/alert?list_id=329&WT.mc_id=EMI_SCIDATA_1508_EpidemiologyJAPANESE&WT.i_dcsvid=%%LIST_ID%%-%%RECIPIENT_ID%%&WT.ec_id=MARKETING" target="_blank" style="color:#ffffff;text-decoration:none;"> Sign up for e-alerts
</a></strong>
</td>
</tr>
</table>
</td>
</tr>
<!-- end of Button -->
<!-- Sub title -->
<tr>
<td width="600" align="center" class="wrapper">
<table width="600" class="wrapper" align="left" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="left" bgcolor="#ffffff" style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:15px;line-height:18px;color:#363636;padding:0px 20px 20px 20px;"> </td>
</tr>
<tr>
<td align="left" bgcolor="#ffffff" style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:15px;line-height:18px;color:#363636;padding:0px 20px 20px 20px;"><strong>編集部が選ぶ Data Descriptors:</strong>
</td>
</tr>
</table>
</td>
</tr>
<!-- end of Sub title -->
<!-- Row 1 -->
<tr>
<td align="left" valign="top" width="600" class="wrapper">
<table width="600" class="wrapper" align="left" border="0" cellspacing="0" cellpadding="0">
<tr>
<td id="gutter" width="20" align="left" valign="top" bgcolor="#ffffff" style="font-size:0px; line-height:0px;"> </td>
<td align="left" valign="top" bgcolor="#ffffff" style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:13px;line-height:18px;color:#666666;"><b>The global compendium of <em>Aedes aegypti</em> and <em>Ae. albopictus</em> occurrence</b><br /><br /><b>A review of epidemiological parameters from Ebola outbreaks to inform early public health decision-making</b><br /><br /><b>A global compendium of human Crimean-Congo haemorrhagic fever virus occurrence</b>
</td>
<td id="gutter" width="20" align="left" valign="top" bgcolor="#ffffff" style="font-size:0px; line-height:0px;">
</td>
</tr>
<tr>
<td id="bottom-height" height="30" colspan="3" align="left" valign="top" bgcolor="#ffffff" style="font-size:0px; line-height:0px;">
</td>
</tr>
</table>
</td>
</tr>
<!-- End of Row 1 -->
<!-- NPG colour bar-->
<tr>
<td width="600" align="right" valign="middle" bgcolor="#ffffff">
<table id="container" width="100%" align="right" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="100%" align="right" valign="middle" bgcolor="#ffffff" style="padding-top:10px;padding-right:20px;padding-bottom:10px;padding-left:20px">
<img src="http://fastart.nature.com/srep/npg_logo.gif" alt="Nature Publishing Group" width="184" height="35" border="0" align="right" style="display:block;" />
</td>
</tr>
</table>
</td>
</tr>
<!-- end of NPG colour bar -->
<!-- footer-->
<tr>
<td width="600" class="wrapper" bgcolor="#e7e7e7">
<table class="container" width="100%" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#e7e7e7" style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:9px;line-height:13px;color:#666666;">
<tr>
<td width="100%" align="left" bgcolor="#e7e7e7" style="padding:25px;">As a registered user of Nature Publishing Group's Web sites, our database indicates that you have opted-in to receive product information and special offers. If you no longer wish to receive these e-mails or to discontinue all e-mail services from Nature Publishing Group please update your online account. <span style="color:#666666;">Modify My Account</span> (Log in to be recognised as a <span style="color:#666666;">Nature.com</span> registrant). <br />
<br />
For further information on <span style="color:#666666;">technical assistance</span> | <span style="color:#666666;">print subscriptions</span> | <a style="color:#666666;" href="mailto:feedback#nature.com" target="_blank"><span style="color:#666666;">other enquiries</span></a>. <br />
<br />
Nature Publishing Group | Principal offices: <span style="color:#666666"><a href="http://www.nature.com/npg_/contact/offices.html?WT.mc_id=EMI_SCIDATA_1508_EpidemiologyJAPANESE&WT.i_dcsvid=%%LIST_ID%%-%%RECIPIENT_ID%%&WT.ec_id=MARKETING" style="text-decoration:none;color:#666666;" target="_blank">London | New York and Tokyo, and offices in cities worldwide including Basingstoke | Barcelona | Boston | Buenos Aires | Cairo | Delhi | Heidelberg | Madrid | Melbourne | Mexico City | Mumbai | Munich | Paris | San Francisco | Sao Paulo | Seoul | Shanghai and Washington DC. Macmillan Publishers Limited is a company incorporated in England & Wales under company number 785998 & whose registered office is located at Brunel Road, Houndmills, Basingstoke, Hampshire RG21 6XS. Nature Publishing Group | One New York Plaza, Suite 4500 | New York
| NY 10004-1562 | US </a></span><br />
<br />
<span class="symbolfix">©</span> 2015 Nature Publishing Group, a division of Macmillan Publishers Limited. All rights reserved.
</td>
</tr>
</table>
</td>
</tr>
<!-- end of footer -->
</table>
<!-- end of wrapper table -->
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- end of 100% table -->
</body>
</html>
Please help!!

Related

Can't resize the width of a button inside a <td>

Hi I'm trying to resize the blue button in the header image, but I can't change its width. It's in a table format inside a <td> i tried using td width also it didn't work. It looks like its fixed to 640px. I tried with style width also but it still didn't work. How else can I edit the width of the blue button? See attached image
As you can see the header image is what im trying to achieve                                                                                                                                                                                                                               
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>You're Invited to the SAP SuccessFactors SuccessConnect in Las Vegas</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="ProgId" content="Word.Document">
</head>
<body style="margin:0; padding:0;" bgcolor="#ffffff" link="#008cd2">
<style type="text/css">
* {
-webkit-text-size-adjust: none;
-webkit-text-resize: 100%;
text-resize: 100%;
}
</style>
<!-- main wrapper -->
<table data-section="body" class="wrapper" width="100%" cellspacing="0" cellpadding="0" bgcolor="#ffffff">
<!-- header -->
<tr>
<td>
<table data-section="header" class="wrapper" width="100%" cellspacing="0" cellpadding="0" bgcolor="#ffffff">
<tr>
<td style="font-size:1px;color:#FFFFFF;">
<font color="#FFFFFF" style="font-size:1px;color:#FFFFFF;line-height:0;">
<!-- inbox preview optimized text -->
<span class="appleLinksWhite">Join SAP in Las Vegas for SuccessConnect at the Aria Resort! Hear from HR industry thought leaders, experts, and special guests.</span>
</font>
</td>
</tr>
<tr>
<td>
<table class="container header-container" title="header-container" width="640" align="center" cellpadding="0" cellspacing="0" bgcolor="#000000" style="margin:0 auto !important; padding:0 20px;">
<tr>
<td>
<table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td height="17" class="height10" style="line-height:1px; font-size:1px;"> </td>
</tr>
<tr>
<td>
<table width="100%" cellspacing="0" cellpadding="0" title="brand">
<tr>
<td valign="middle" width="414" style="line-height:1px; font-size:1px;"><img src="https://portal.thinkwgroup.com/html-email/sap/email/images/logo-carlyle-group.png" alt="" border="0"style="vertical-align:top; width: 201px; height: 36px;"></a></td>
<td valign="middle" align="right" width="104" style="line-height:1px; font-size:1px;"><a title="THE BEST RUN" href="https://www.sap.com" style="text-decoration:none;"><img src="https://fm.sap.com/images/2015/run-simple-email/TheBestRunLogo-64px-White-DG.png" alt="THE BEST RUN" border="0" hspace="0" vspace="0" width="104" height="32" title="tagline" style="vertical-align:top; width: 104px; height: 32px;"></a></td>
<td width="10" class="hide" style="line-height:1px; font-size:1px;"> </td>
<td valign="middle" align="right" width="72" style="line-height:1px; font-size:1px;"><a title="SAP" href="https://www.sap.com" style="text-decoration:none;"><img src="https://fm.sap.com/images/2015/run-simple-email/logo.png" alt="SAP" border="0" hspace="0" vspace="0" width="72" height="36" title="logo" style="vertical-align:top; width: 72px; height: 36px;"></a></td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="17" class="height10" style="line-height:1px; font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<!-- main -->
<tr>
<td>
<table data-section="main" class="wrapper" width="100%" cellspacing="0" cellpadding="0" bgcolor="#ffffff">
<tr>
<td>
<table class="flexible" width="640" align="center" cellpadding="0" cellspacing="0" style="margin:0 auto !important;">
<tr data-section="hero">
<td>
<table class="flexible" width="640" align="center" cellpadding="0" cellspacing="0" style="margin:0 auto !important;">
<tr class="motion-row">
<td width="100%" valign="top" bgcolor="#000000">
<table background="https://portal.thinkwgroup.com/html-email/sap/email/images/banner-lasvegas.jpg" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td style="line-height:1px; font-size:1px;" height="60"> </td>
</tr>
<tr>
<td style="font:36px/44px Arial, Helvetica, sans-serif; color:#ffffff;">
<span class="font22">Join SAP in Las Vegas for Success<span style='color:#f0ab00;'>Connect</span> at the Aria Resort!</span><br>
</td>
</tr>
<tr>
<td align="center" bgcolor="#008fd3" width="50" height="40"><a class="font14" style="font: 18px Arial, Helvetica, sans-serif; color: #ffffff; text-align: center; text-decoration: none; display: block;" href="https://events.sap.com/gb/cx-live-2019-london/en/registration.aspx?cid=10902&autoplay=off" target="_blank" data-sap-hpa-ceimo-ioi-link="73554900100700000840">Register today</a></td>
</tr>
<!-- main
<tr>
<td class="widthAuto mceEditable" style= align="center" valign="middle" bgcolor="#008fd3" width="250" height="40"><a class="font14" style="font: 18px/18px Arial, Helvetica, sans-serif; color: #ffffff; text-align: center; text-decoration: none; display: block;" href="https://events.sap.com/successconnect/en/las-vegas-2019" target="_blank" data-sap-hpa-ceimo-ioi-link="73555000100800000773">Register today ›</a></td>
</tr>
-->
<tr>
<td style="line-height:1px; font-size:1px;" height="40"> </td>
</tr>
<tr>
<td style="line-height:1px; font-size:1px;" height="40"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="30" style="line-height:1px; font-size:1px;"> </td>
</tr>
<tr data-section="subhead">
<td>
<table class="container" width="640" align="center" cellpadding="0" cellspacing="0" style="margin:0 auto !important; padding:0 20px;">
<tr>
<td align="left" style="font:22px/30px Arial, Helvetica, sans-serif; color:#444444;">
<span class="font19">Hear from HR industry thought leaders, experts, and special guests.</span>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table class="container" width="640" align="center" cellpadding="0" cellspacing="0" style="margin:0 auto !important; padding:0 20px;">
<!-- email body -->
<tr>
<td>
<table width="100%" cellspacing="0" cellpadding="0">
<tr data-section="content">
<td>
<table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td style="font:14px/21px Arial, Helvetica, sans-serif; color:#444444;">
<p>You are cordially invited to attend our annual SuccessConnec<u>t</u> event, held by SAP SuccessFactors this September 16–18 in Las Vegas. Regarded as one of the top HR events of the year, SuccessConnect brings industry <strong>thought leaders</strong>, current and prospective <strong>customers</strong>, <strong>technology partners</strong>, and <strong>solutions experts</strong> together to share their <strong>experiences</strong>, <strong>best practices</strong>, and <strong>innovations</strong>. The event offers more than 100 breakout sessions alongside many <strong>high-level networking opportunities</strong>.</p>
<p class="xmsonormal">The future workplace looks very different from what we see today. From technological advancements to the ever-changing nature of jobs, skills, and careers, businesses need to find ways to succeed in a world that’s being reshaped by continuous innovation and disruption. Learn how SAP SuccessFactors solutions can help your company right now and help <strong>plan for future initiatives</strong>.</p>
<hr>
<p></p>
<table class="template-2col image-l split50 mceNonEditable" style="width: 100%;" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="hide-email mceEditable" style="vertical-align: top; font: 14px/21px Arial, Helvetica, sans-serif; color: #444444;" valign="top" width="50%">
<p><img class="photo" src="https://portal.thinkwgroup.com/html-email/sap/email/images/image-lasvegas.jpg" width="280" height="158" /></p>
</td>
<td class="mobile-block2 mceEditable" style="vertical-align: top; font: 14px/21px Arial, Helvetica, sans-serif; color: #444444;" width="50%">
<p>This event provides a fantastic forum to meet other HR professionals and find out how they’re using SAP SuccessFactors to help <strong>drive a digital HR strategy</strong>, transform talent, recruitment, and learning programs, as well as <strong>improve HR process efficiency</strong>.</p>
</td>
</tr>
<tr>
<td colspan="2" valign="middle" height="10"> </td>
</tr>
</tbody>
</table>
<p class="xmsonormal">Enjoy a celebratory evening at KAOS nightclub in the iconic Palms Resort Casino, where you’ll get to network with your peers while enjoying great entertainment.</p>
<p><strong>Please register here.</strong></p>
<p>We look forward to seeing you in Las Vegas!</p>
<table class="mceNonEditable" border="0" width="100%" cellspacing="0" cellpadding="0">
<tbody>
<tr data-section="callout">
<td>
<table width="100%" cellspacing="0" cellpadding="0" bgcolor="#f5f5f5">
<tbody>
<tr>
<td style="line-height: 1px; font-size: 1px;" height="16"> </td>
</tr>
<tr>
<td>
<table width="100%" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="width20 " width="42"> </td>
<td class="mceEditable" style="font: 14px/21px Arial, Helvetica, sans-serif; color: #444444;">
<p><strong>SAP SuccessFactors SuccessConnect</strong></p>
<p><strong>Date:</strong><br />September 16–18, 2019</p>
<p><strong>Location:</strong><br />Aria Resort and Casino</p>
<p><strong>Address:</strong><br />3730 S Las Vegas Blvd<br />Las Vegas, NV 89158</p>
<table class="cta-button mceNonEditable" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="widthAuto mceEditable" style="border-radius: 5px;" align="center" valign="middle" bgcolor="#008fd3" width="250" height="40"><a class="font14" style="font: 18px/18px Arial, Helvetica, sans-serif; color: #ffffff; text-align: center; text-decoration: none; display: block;" href="https://events.sap.com/successconnect/en/las-vegas-2019" target="_blank" data-sap-hpa-ceimo-ioi-link="73555000100800000773">Register today ›</a></td>
</tr>
<tr>
<td style="line-height: 1px; font-size: 1px;" height="15"> </td>
</tr>
</tbody>
</table>
</td>
<td class="width20 " width="42"> </td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td style="line-height: 1px; font-size: 1px;" height="16"> </td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="35" class="height28" style="line-height:1px; font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<div style="display:none; white-space:nowrap; font:15px/2px courier; color:#ffffff;">- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
You should change you code
From
<td align="center" bgcolor="#008fd3" width="50" height="40"><a class="font14" style="font: 18px Arial, Helvetica, sans-serif; color: #ffffff; text-align: center; text-decoration: none; display: block;" href="https://events.sap.com/gb/cx-live-2019-london/en/registration.aspx?cid=10902&autoplay=off" target="_blank" data-sap-hpa-ceimo-ioi-link="73554900100700000840">Register today</a></td>
to
<td width="50" height="40" bgcolor="#202020" align="center">
<a class="font14" style="font: 18px Arial, Helvetica, sans-serif; color: #ffffff; text-align: center; text-decoration: none; display: block;background: #008fd3;width: 20%;position: absolute;padding: 8px;" href="https://events.sap.com/gb/cx-live-2019-london/en/registration.aspx?cid=10902&autoplay=off" target="_blank" rel="noopener" data-sap-hpa-ceimo-ioi-link="73554900100700000840" data-mce-href="https://events.sap.com/gb/cx-live-2019-london/en/registration.aspx?cid=10902&autoplay=off" data-mce-style="font: 18px Arial, Helvetica, sans-serif; color: #ffffff; text-align: center; text-decoration: none; display: block;" data-mce-selected="1">Register today</a>
</td>
Hope can help you
You need to remove display:block
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>You're Invited to the SAP SuccessFactors SuccessConnect in Las Vegas</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="ProgId" content="Word.Document">
</head>
<body style="margin:0; padding:0;" bgcolor="#ffffff" link="#008cd2">
<style type="text/css">
* {
-webkit-text-size-adjust: none;
-webkit-text-resize: 100%;
text-resize: 100%;
}
</style>
<!-- main wrapper -->
<table data-section="body" class="wrapper" width="100%" cellspacing="0" cellpadding="0" bgcolor="#ffffff">
<!-- header -->
<tr>
<td>
<table data-section="header" class="wrapper" width="100%" cellspacing="0" cellpadding="0" bgcolor="#ffffff">
<tr>
<td style="font-size:1px;color:#FFFFFF;">
<font color="#FFFFFF" style="font-size:1px;color:#FFFFFF;line-height:0;">
<!-- inbox preview optimized text -->
<span class="appleLinksWhite">Join SAP in Las Vegas for SuccessConnect at the Aria Resort! Hear from HR industry thought leaders, experts, and special guests.</span>
</font>
</td>
</tr>
<tr>
<td>
<table class="container header-container" title="header-container" width="640" align="center" cellpadding="0" cellspacing="0" bgcolor="#000000" style="margin:0 auto !important; padding:0 20px;">
<tr>
<td>
<table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td height="17" class="height10" style="line-height:1px; font-size:1px;"> </td>
</tr>
<tr>
<td>
<table width="100%" cellspacing="0" cellpadding="0" title="brand">
<tr>
<td valign="middle" width="414" style="line-height:1px; font-size:1px;"><img src="https://portal.thinkwgroup.com/html-email/sap/email/images/logo-carlyle-group.png" alt="" border="0" style="vertical-align:top; width: 201px; height: 36px;"></a>
</td>
<td valign="middle" align="right" width="104" style="line-height:1px; font-size:1px;">
<a title="THE BEST RUN" href="https://www.sap.com" style="text-decoration:none;"><img src="https://fm.sap.com/images/2015/run-simple-email/TheBestRunLogo-64px-White-DG.png" alt="THE BEST RUN" border="0" hspace="0" vspace="0" width="104" height="32" title="tagline" style="vertical-align:top; width: 104px; height: 32px;"></a>
</td>
<td width="10" class="hide" style="line-height:1px; font-size:1px;"> </td>
<td valign="middle" align="right" width="72" style="line-height:1px; font-size:1px;">
<a title="SAP" href="https://www.sap.com" style="text-decoration:none;"><img src="https://fm.sap.com/images/2015/run-simple-email/logo.png" alt="SAP" border="0" hspace="0" vspace="0" width="72" height="36" title="logo" style="vertical-align:top; width: 72px; height: 36px;"></a>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="17" class="height10" style="line-height:1px; font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<!-- main -->
<tr>
<td>
<table data-section="main" class="wrapper" width="100%" cellspacing="0" cellpadding="0" bgcolor="#ffffff">
<tr>
<td>
<table class="flexible" width="640" align="center" cellpadding="0" cellspacing="0" style="margin:0 auto !important;">
<tr data-section="hero">
<td>
<table class="flexible" width="640" align="center" cellpadding="0" cellspacing="0" style="margin:0 auto !important;">
<tr class="motion-row">
<td width="100%" valign="top" bgcolor="#000000">
<table background="https://portal.thinkwgroup.com/html-email/sap/email/images/banner-lasvegas.jpg" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td style="line-height:1px; font-size:1px;" height="60"> </td>
</tr>
<tr>
<td style="font:36px/44px Arial, Helvetica, sans-serif; color:#ffffff;">
<span class="font22">Join SAP in Las Vegas for Success<span style='color:#f0ab00;'>Connect</span> at the Aria Resort!</span><br>
</td>
</tr>
<tr>
<td align="left" width="50" height="40">
<a class="font14" style="font: 18px Arial, Helvetica, sans-serif; color: #ffffff; text-align: center; text-decoration: none; background:#008fd3; display: inline-block;
line-height: 40px;
padding: 0 1em;" href="https://events.sap.com/gb/cx-live-2019-london/en/registration.aspx?cid=10902&autoplay=off"
target="_blank" data-sap-hpa-ceimo-ioi-link="73554900100700000840">Register today</a>
</td>
</tr>
<!-- main
<tr>
<td class="widthAuto mceEditable" style= align="center" valign="middle" bgcolor="#008fd3" width="250" height="40"><a class="font14" style="font: 18px/18px Arial, Helvetica, sans-serif; color: #ffffff; text-align: center; text-decoration: none; display: block;" href="https://events.sap.com/successconnect/en/las-vegas-2019" target="_blank" data-sap-hpa-ceimo-ioi-link="73555000100800000773">Register today ›</a></td>
</tr>
-->
<tr>
<td style="line-height:1px; font-size:1px;" height="40"> </td>
</tr>
<tr>
<td style="line-height:1px; font-size:1px;" height="40"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="30" style="line-height:1px; font-size:1px;"> </td>
</tr>
<tr data-section="subhead">
<td>
<table class="container" width="640" align="center" cellpadding="0" cellspacing="0" style="margin:0 auto !important; padding:0 20px;">
<tr>
<td align="left" style="font:22px/30px Arial, Helvetica, sans-serif; color:#444444;">
<span class="font19">Hear from HR industry thought leaders, experts, and special guests.</span>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table class="container" width="640" align="center" cellpadding="0" cellspacing="0" style="margin:0 auto !important; padding:0 20px;">
<!-- email body -->
<tr>
<td>
<table width="100%" cellspacing="0" cellpadding="0">
<tr data-section="content">
<td>
<table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td style="font:14px/21px Arial, Helvetica, sans-serif; color:#444444;">
<p>You are cordially invited to attend our annual SuccessConnec<u>t</u> event, held by SAP SuccessFactors this September 16–18 in Las Vegas. Regarded as one of the top HR events of the year, SuccessConnect
brings industry <strong>thought leaders</strong>, current and prospective <strong>customers</strong>, <strong>technology partners</strong>, and <strong>solutions experts</strong> together to share their <strong>experiences</strong>,
<strong>best practices</strong>, and <strong>innovations</strong>. The event offers more than 100 breakout sessions alongside many <strong>high-level networking opportunities</strong>.</p>
<p class="xmsonormal">The future workplace looks very different from what we see today. From technological advancements to the ever-changing nature of jobs, skills, and careers, businesses need to find ways to succeed in a world that’s
being reshaped by continuous innovation and disruption. Learn how SAP SuccessFactors solutions can help your company right now and help <strong>plan for future initiatives</strong>.</p>
<hr>
<p></p>
<table class="template-2col image-l split50 mceNonEditable" style="width: 100%;" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="hide-email mceEditable" style="vertical-align: top; font: 14px/21px Arial, Helvetica, sans-serif; color: #444444;" valign="top" width="50%">
<p><img class="photo" src="https://portal.thinkwgroup.com/html-email/sap/email/images/image-lasvegas.jpg" width="280" height="158" /></p>
</td>
<td class="mobile-block2 mceEditable" style="vertical-align: top; font: 14px/21px Arial, Helvetica, sans-serif; color: #444444;" width="50%">
<p>This event provides a fantastic forum to meet other HR professionals and find out how they’re using SAP SuccessFactors to help <strong>drive a digital HR strategy</strong>, transform talent, recruitment, and
learning programs, as well as <strong>improve HR process efficiency</strong>.</p>
</td>
</tr>
<tr>
<td colspan="2" valign="middle" height="10"> </td>
</tr>
</tbody>
</table>
<p class="xmsonormal">Enjoy a celebratory evening at KAOS nightclub in the iconic Palms Resort Casino, where you’ll get to network with your peers while enjoying great entertainment.</p>
<p><strong>Please register here.</strong></p>
<p>We look forward to seeing you in Las Vegas!</p>
<table class="mceNonEditable" border="0" width="100%" cellspacing="0" cellpadding="0">
<tbody>
<tr data-section="callout">
<td>
<table width="100%" cellspacing="0" cellpadding="0" bgcolor="#f5f5f5">
<tbody>
<tr>
<td style="line-height: 1px; font-size: 1px;" height="16"> </td>
</tr>
<tr>
<td>
<table width="100%" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="width20 " width="42"> </td>
<td class="mceEditable" style="font: 14px/21px Arial, Helvetica, sans-serif; color: #444444;">
<p><strong>SAP SuccessFactors SuccessConnect</strong></p>
<p><strong>Date:</strong><br />September 16–18, 2019</p>
<p><strong>Location:</strong><br />Aria Resort and Casino</p>
<p><strong>Address:</strong><br />3730 S Las Vegas Blvd<br />Las Vegas, NV 89158</p>
<table class="cta-button mceNonEditable" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="widthAuto mceEditable" style="border-radius: 5px;" align="center" valign="middle" bgcolor="#008fd3" width="250" height="40"><a class="font14" style="font: 18px/18px Arial, Helvetica, sans-serif; color: #ffffff; text-align: center; text-decoration: none; display: block;" href="https://events.sap.com/successconnect/en/las-vegas-2019"
target="_blank" data-sap-hpa-ceimo-ioi-link="73555000100800000773">Register today ›</a></td>
</tr>
<tr>
<td style="line-height: 1px; font-size: 1px;" height="15"> </td>
</tr>
</tbody>
</table>
</td>
<td class="width20 " width="42"> </td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td style="line-height: 1px; font-size: 1px;" height="16"> </td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="35" class="height28" style="line-height:1px; font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<div style="display:none; white-space:nowrap; font:15px/2px courier; color:#ffffff;">- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>You're Invited to the SAP SuccessFactors SuccessConnect in Las Vegas</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="ProgId" content="Word.Document">
</head>
<body style="margin:0; padding:0;" bgcolor="#ffffff" link="#008cd2">
<style type="text/css">
* {
-webkit-text-size-adjust: none;
-webkit-text-resize: 100%;
text-resize: 100%;
}
</style>
<!-- main wrapper -->
<table data-section="body" class="wrapper" width="100%" cellspacing="0" cellpadding="0" bgcolor="#ffffff">
<!-- header -->
<tr>
<td>
<table data-section="header" class="wrapper" width="100%" cellspacing="0" cellpadding="0" bgcolor="#ffffff">
<tr>
<td style="font-size:1px;color:#FFFFFF;">
<font color="#FFFFFF" style="font-size:1px;color:#FFFFFF;line-height:0;">
<!-- inbox preview optimized text -->
<span class="appleLinksWhite">Join SAP in Las Vegas for SuccessConnect at the Aria Resort! Hear from HR industry thought leaders, experts, and special guests.</span>
</font>
</td>
</tr>
<tr>
<td>
<table class="container header-container" title="header-container" width="640" align="center" cellpadding="0" cellspacing="0" bgcolor="#000000" style="margin:0 auto !important; padding:0 20px;">
<tr>
<td>
<table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td height="17" class="height10" style="line-height:1px; font-size:1px;"> </td>
</tr>
<tr>
<td>
<table width="100%" cellspacing="0" cellpadding="0" title="brand">
<tr>
<td valign="middle" width="414" style="line-height:1px; font-size:1px;"><img src="https://portal.thinkwgroup.com/html-email/sap/email/images/logo-carlyle-group.png" alt="" border="0"style="vertical-align:top; width: 201px; height: 36px;"></a></td>
<td valign="middle" align="right" width="104" style="line-height:1px; font-size:1px;"><a title="THE BEST RUN" href="https://www.sap.com" style="text-decoration:none;"><img src="https://fm.sap.com/images/2015/run-simple-email/TheBestRunLogo-64px-White-DG.png" alt="THE BEST RUN" border="0" hspace="0" vspace="0" width="104" height="32" title="tagline" style="vertical-align:top; width: 104px; height: 32px;"></a></td>
<td width="10" class="hide" style="line-height:1px; font-size:1px;"> </td>
<td valign="middle" align="right" width="72" style="line-height:1px; font-size:1px;"><a title="SAP" href="https://www.sap.com" style="text-decoration:none;"><img src="https://fm.sap.com/images/2015/run-simple-email/logo.png" alt="SAP" border="0" hspace="0" vspace="0" width="72" height="36" title="logo" style="vertical-align:top; width: 72px; height: 36px;"></a></td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="17" class="height10" style="line-height:1px; font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<!-- main -->
<tr>
<td>
<table data-section="main" class="wrapper" width="100%" cellspacing="0" cellpadding="0" bgcolor="#ffffff">
<tr>
<td>
<table class="flexible" width="640" align="center" cellpadding="0" cellspacing="0" style="margin:0 auto !important;">
<tr data-section="hero">
<td>
<table class="flexible" width="640" align="center" cellpadding="0" cellspacing="0" style="margin:0 auto !important;">
<tr class="motion-row">
<td width="100%" valign="top" bgcolor="#000000">
<table background="https://portal.thinkwgroup.com/html-email/sap/email/images/banner-lasvegas.jpg" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td style="line-height:1px; font-size:1px;" height="60"> </td>
</tr>
<tr>
<td style="font:36px/44px Arial, Helvetica, sans-serif; color:#ffffff;">
<span class="font22">Join SAP in Las Vegas for Success<span style='color:#f0ab00;'>Connect</span> at the Aria Resort!</span><br>
</td>
</tr>
<tr>
<td align="center" bgcolor="#008fd3" width="50" height="40" style="width: 20%;display: block;"><a class="font14" style="font: 18px Arial, Helvetica, sans-serif;color: #ffffff;text-align: center;text-decoration: none;display: block;width: 100%;padding: 10px 0px;" href="https://events.sap.com/gb/cx-live-2019-london/en/registration.aspx?cid=10902&autoplay=off" target="_blank" data-sap-hpa-ceimo-ioi-link="73554900100700000840">Register today</a></td>
</tr>
<!-- main
<tr>
<td class="widthAuto mceEditable" style= align="center" valign="middle" bgcolor="#008fd3" width="250" height="40"><a class="font14" style="font: 18px/18px Arial, Helvetica, sans-serif; color: #ffffff; text-align: center; text-decoration: none; display: block;" href="https://events.sap.com/successconnect/en/las-vegas-2019" target="_blank" data-sap-hpa-ceimo-ioi-link="73555000100800000773">Register today ›</a></td>
</tr>
-->
<tr>
<td style="line-height:1px; font-size:1px;" height="40"> </td>
</tr>
<tr>
<td style="line-height:1px; font-size:1px;" height="40"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="30" style="line-height:1px; font-size:1px;"> </td>
</tr>
<tr data-section="subhead">
<td>
<table class="container" width="640" align="center" cellpadding="0" cellspacing="0" style="margin:0 auto !important; padding:0 20px;">
<tr>
<td align="left" style="font:22px/30px Arial, Helvetica, sans-serif; color:#444444;">
<span class="font19">Hear from HR industry thought leaders, experts, and special guests.</span>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table class="container" width="640" align="center" cellpadding="0" cellspacing="0" style="margin:0 auto !important; padding:0 20px;">
<!-- email body -->
<tr>
<td>
<table width="100%" cellspacing="0" cellpadding="0">
<tr data-section="content">
<td>
<table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td style="font:14px/21px Arial, Helvetica, sans-serif; color:#444444;">
<p>You are cordially invited to attend our annual SuccessConnec<u>t</u> event, held by SAP SuccessFactors this September 16–18 in Las Vegas. Regarded as one of the top HR events of the year, SuccessConnect brings industry <strong>thought leaders</strong>, current and prospective <strong>customers</strong>, <strong>technology partners</strong>, and <strong>solutions experts</strong> together to share their <strong>experiences</strong>, <strong>best practices</strong>, and <strong>innovations</strong>. The event offers more than 100 breakout sessions alongside many <strong>high-level networking opportunities</strong>.</p>
<p class="xmsonormal">The future workplace looks very different from what we see today. From technological advancements to the ever-changing nature of jobs, skills, and careers, businesses need to find ways to succeed in a world that’s being reshaped by continuous innovation and disruption. Learn how SAP SuccessFactors solutions can help your company right now and help <strong>plan for future initiatives</strong>.</p>
<hr>
<p></p>
<table class="template-2col image-l split50 mceNonEditable" style="width: 100%;" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="hide-email mceEditable" style="vertical-align: top; font: 14px/21px Arial, Helvetica, sans-serif; color: #444444;" valign="top" width="50%">
<p><img class="photo" src="https://portal.thinkwgroup.com/html-email/sap/email/images/image-lasvegas.jpg" width="280" height="158" /></p>
</td>
<td class="mobile-block2 mceEditable" style="vertical-align: top; font: 14px/21px Arial, Helvetica, sans-serif; color: #444444;" width="50%">
<p>This event provides a fantastic forum to meet other HR professionals and find out how they’re using SAP SuccessFactors to help <strong>drive a digital HR strategy</strong>, transform talent, recruitment, and learning programs, as well as <strong>improve HR process efficiency</strong>.</p>
</td>
</tr>
<tr>
<td colspan="2" valign="middle" height="10"> </td>
</tr>
</tbody>
</table>
<p class="xmsonormal">Enjoy a celebratory evening at KAOS nightclub in the iconic Palms Resort Casino, where you’ll get to network with your peers while enjoying great entertainment.</p>
<p><strong>Please register here.</strong></p>
<p>We look forward to seeing you in Las Vegas!</p>
<table class="mceNonEditable" border="0" width="100%" cellspacing="0" cellpadding="0">
<tbody>
<tr data-section="callout">
<td>
<table width="100%" cellspacing="0" cellpadding="0" bgcolor="#f5f5f5">
<tbody>
<tr>
<td style="line-height: 1px; font-size: 1px;" height="16"> </td>
</tr>
<tr>
<td>
<table width="100%" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="width20 " width="42"> </td>
<td class="mceEditable" style="font: 14px/21px Arial, Helvetica, sans-serif; color: #444444;">
<p><strong>SAP SuccessFactors SuccessConnect</strong></p>
<p><strong>Date:</strong><br />September 16–18, 2019</p>
<p><strong>Location:</strong><br />Aria Resort and Casino</p>
<p><strong>Address:</strong><br />3730 S Las Vegas Blvd<br />Las Vegas, NV 89158</p>
<table class="cta-button mceNonEditable" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="widthAuto mceEditable" style="border-radius: 5px;" align="center" valign="middle" bgcolor="#008fd3" width="250" height="40"><a class="font14" style="font: 18px/18px Arial, Helvetica, sans-serif; color: #ffffff; text-align: center; text-decoration: none; display: block;" href="https://events.sap.com/successconnect/en/las-vegas-2019" target="_blank" data-sap-hpa-ceimo-ioi-link="73555000100800000773">Register today ›</a></td>
</tr>
<tr>
<td style="line-height: 1px; font-size: 1px;" height="15"> </td>
</tr>
</tbody>
</table>
</td>
<td class="width20 " width="42"> </td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td style="line-height: 1px; font-size: 1px;" height="16"> </td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="35" class="height28" style="line-height:1px; font-size:1px;"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<div style="display:none; white-space:nowrap; font:15px/2px courier; color:#ffffff;">- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
<td align="center" bgcolor="#008fd3" width="50" height="40" style="width: 20%;display: block;">
<a class="font14" style="font: 18px Arial, Helvetica, sans-serif;color: #ffffff;text-align: center;text-decoration: none;display: block;width: 100%;padding: 10px 0px;" href="https://events.sap.com/gb/cx-live-2019-london/en/registration.aspx?cid=10902&autoplay=off" target="_blank" data-sap-hpa-ceimo-ioi-link="73554900100700000840">Register today</a>
</td>
simple My code Replease To Your Code

HTML email signature Gmail app adds extra space between every table

I have a problem when I send an HTML email signature from MS Outlook.
The problem is that the signature adds extra white space between all the elements and content such as text and even the horizontal line below the name.
The code in my HTML file looks like this:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="format-detection" content="date=no" />
<meta name="format-detection" content="address=no" />
<meta name="format-detection" content="telephone=no" />
<title>Boating World</title>
<style type="text/css" media="screen">
/*<![CDATA[*/
/* Linked Styles */
body {
padding: 0 !important;
margin: 0 !important;
display: block !important;
background: #ffffff;
-webkit-text-size-adjust: none
}
/*]]>*/
</style>
</head>
<body style="padding:0 !important; margin:0 !important; display:block !important; background:#ffffff; -webkit-text-size-adjust:none">
<table width="500" height="180" border="0" cellspacing="0" cellpadding="0" bgcolor="#ffffff">
<tr>
<td align="left" valign="top">
<table width="500" border="0" cellspacing="0" cellpadding="0">
<tr>
<td style="font-size:0pt; line-height:0pt; padding:0; margin:0; font-weight:normal; width:500px; min-width:500px; margin:0" width="500">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td style=" font-family:Arial, sans-serif; font-size:13px; color:#002855; font-weight:bold; line-height:18px;">
Kind Regards
</td>
</tr>
<tr>
<td height="5" style="font-size: 0px; line-height: 5px;">
</td>
</tr>
<tr>
<td style="font-family:Arial, sans-serif; font-size:16px; color:#002855; font-weight:600; line-height:20px; text-transform:uppercase; font-stretch:semi-expanded;">
<!-- Write your name and surname here -->
ELZAAN STEENKAMP
<!-- End of name -->
</td>
</tr>
<tr>
<td height="10" style="font-size: 0px; line-height: 10px;">
</td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td style="border: none; font-size:0pt; line-height:0pt; text-align:left" height="1" bgcolor="#909090">
</td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="5" style="font-size: 5px; line-height: 5px;">
</td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<table width="200" align="left" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="22" style="font-family:Arial, sans-serif; font-size:13px; color:#002c5c; font-weight:bold; line-height:20px;">T:
<span style="font-family:Arial; font-weight:100; color:#444444;">
<a href="#" style="text-decoration:none; color:#444444; cursor:default;">
<!-- Write your landline telephone number here (Please type in same manner "+27 (0)21 418 0840”) -->
+27 (0) 21 418 0840
<!-- end of telephone number -->
</a>
</span>
</td>
</tr>
<tr>
<td height="22" style="font-family:Arial, sans-serif; font-size:13px; color:#002c5c; font-weight:bold; line-height:20px;">C:
<span style="font-family:Arial; font-weight:100; color:#444444;">
<a href="#" style="text-decoration:none; color:#444444; cursor:default;">
<!-- Write the cellphone number here (Please type in similar manner "+27 (0)82 000 0000) -->
+27 (0) 83 400 3418
<!-- end of telephone number -->
</a>
</span>
</td>
</tr>
<tr>
<td height="22" style="font-family:Arial, sans-serif; font-size:13px; color:#002c5c; font-weight:bold; line-height:20px;">E:
<span style="font-family:Arial; font-weight:100; color:#444444;">
<!-- To put in your email address, you need to add it twice, once next to where it states mailto: and then below, be careful not to change anything other than the email name. -->
<a href="mailto:accounts#boatingworld.co.za" style="text-decoration:none; color:#444444; cursor:default;">
<!-- End of email address code -->
<!-- Write your email address here as well -->
accounts#boatingworld.co.za
<!-- End of email address -->
</a>
</span>
</td>
</tr>
</table>
<!--[if mso]></td><td><![endif]-->
<table align="left" width="20" height="20" style="font-size:20px; line-height: 20px;">
<tr>
<td> </td>
</tr>
</table>
<!--[if mso]></td><td><![endif]-->
<table width="200" align="left" style="display:inline-table;">
<tr>
<td style="line-height:10px">
<img src="https://www.boatingworld.co.za/email_signature/bw_logo.jpg" style="display:block"/>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="5" style="font-size: 5px; line-height: 5px;">
</td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="20" align="left">
<a href="https://www.facebook.com/boatingworld?v=info" style="text-decoration:none; border:none;">
<img src="https://www.boatingworld.co.za/email_signature/facebook.jpg" />
</a>
</td>
<td width="20" align="left">
<a href="https://twitter.com/BoatingWorld1" style="text-decoration:none; border:none;">
<img src="https://www.boatingworld.co.za/email_signature/twitter.jpg" />
</a>
</td>
<td width="20" align="left">
<a href="https://www.instagram.com/boating.world/" style="text-decoration:none; border:none;">
<img src="https://www.boatingworld.co.za/email_signature/instagram.jpg" />
</a>
</td>
<td width="20" align="left">
<a href="http://www.youtube.com/user/BoatingWorldSA1" style="text-decoration:none; border:none;">
<img src="https://www.boatingworld.co.za/email_signature/youtube.jpg" />
</a>
</td>
<td width="420" align="left">
</td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="5" style="font-size: 5px; line-height: 5px;">
</td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td style="font-family:Arial, sans-serif; font-size:13px; color:#002855; font-weight: 600; line-height:18px; text-transform:uppercase;">
<a href="https://www.boatingworld.co.za/" style="text-decoration: none;">
<span style="font-family:Arial, sans-serif; font-size:13px; color:#002855; font-weight:bold; line-height:18px; text-transform:uppercase;">
WWW.BOATINGWORLD.CO.ZA
</span>
</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
I have tested multiple solutions answered elsewhere on the internet on different forums but to no avail.
Please can someone assist with this as this is for a very important client.
Thanks.
I had the same issue. I solved it by adding below styles for p tag.
p { margin-top: 1px; margin-bottom:1px; margin-left:1px; margin-right:1px; }

Email Width not being respected in Outlook for Windows (only)

My email HTML sets widths for Tables / inside content, and it works well on Mac & Mobile; Windows Outlook, on the other hand, has the Header/Footer content at one width, and the Body Content at another (wider) width.
I've been banging my head trying to figure this out - and am at a loss.
I've searched through S.O. to see if others figured this out, but haven't had any luck there, either.
Any help would be appreciated.
Code below:
<body style="padding:0; margin:0;" bgcolor="#dadada">
<div style="display:none;font-size:1px;color:#333333;line-height:1px;max-height:0px;max-width:0px;opacity:0;overflow:hidden;"> Focus on what really matters at work and don't give your feet a second thought when wearing our most popular professional styles: flats, heels and more. </div>
<!-- END PREVIEW TEXT -->
<!-- header wrapper -->
<table width="100%" bgcolor="#F9F8F8" cellpadding="0" cellspacing="0" border="0" style="padding:0;margin:0;border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;table-layout:fixed;">
<tr>
<td align="center">
<table width="600" bgcolor="#ffffff" align="center" cellpadding="0" cellspacing="0" border="0" class="width320" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;color:#ffffff;font-family:gothamy, 'helvetica neue', helvetica, arial, sans-serif;font-size:14px;min-width:300px !important;">
<tr>
<td>
<table width="2" align="left" cellpadding="0" cellspacing="0" border="0" class="hide" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;color:#ffffff;font-family:'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', 'DejaVu Sans', 'Trebuchet MS', sans-serif;font-size:14px;">
<tr>
<td height="5" valign="middle" style="color:#808080;font-family:gothamy, 'helvetica neue', helvetica, arial, sans-serif;font-size:10px;line-height:15px;" mc:edit="preheader"></td>
</tr>
</table>
<table width="100%" align="right" cellpadding="0" cellspacing="0" border="0" class="preheader" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;color:#ffffff;font-family:gothamy, 'helvetica neue', helvetica, arial, sans-serif;font-size:14px;text-align:left;">
<!-- preheader -->
<tr>
<td height="30" valign="middle" style="mso-line-height-rule:exactly;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;color:#808080;font-family:gothamy, 'helvetica neue', helvetica, arial, sans-serif;font-size:10px;line-height:15px;">  <b>Look forward to Spring with these hot new styles!</b>
<br>   Can't see images? <span style="color:#808080; text-decoration:none;">View this in your browser</span>.</td>
</tr>
<!-- end preheader -->
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table width="100%" bgcolor="#F9F8F8" cellpadding="0" cellspacing="0" border="0" style="padding:0;margin:0;border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;">
<tr>
<td align="center">
<table bgcolor="#ffffff" width="600" align="center" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;" class="width320">
<tr>
<td height="20" width="100%" colspan="3"></td>
</tr>
<!-- spacing -->
<tr>
<td width="2" style="color:#ffffff;font-family:'Gotham A', 'Gotham B', Helvetica, Arial, sans-serif;font-size:14px;" valign="middle" align="center">
<table width="100%" align="center" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;" class="width280">
<!-- logo -->
<tr>
<td align="center" mc:edit="logo"> <img src="https://gallery.mailchimp.com/f65fdf760c91701e37252f426/images/eee1454a-c0ce-4029-8047-8a13eb4811c3.gif" width="240" border="0" style="max-width:600px;" class="width280" alt="Vionic®">
</td>
</tr>
<!-- end logo -->
<tr>
<td></td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<!-- header nav -->
<table width="100%" align="center" cellpadding="0" cellspacing="0" border="0" bgcolor="#000000" style="height:50px;font-family:gothamy, 'helvetica neue', helvetica, arial, sans-serif;color:#ffffff;">
<tr>
<td width="37" class="hide"></td>
<td align="center" width="525" class="nav-block">
<table width="100%" align="center" cellpadding="0" cellspacing="0" border="0" style="height:25px;border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;border-color:#ffffff;" bgcolor="#000000" class="width320nav">
<tr>
<td align="center" style="mso-line-height-rule:exactly;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;font-family:'MrsEavesOT-Roman', 'times new roman', serif;color:#ffffff !important;padding:10px 0;" class="nav-block"><span style="color:#ffffff; text-decoration:none;">SHOP WOMEN</span>
</td>
<td class="hide"> </td>
<td class="nav-block show" width="1" bgcolor="#FFFFFF" style="font-size:0px;line-height:0px;display:none;height:0px;width:0px;max-height:0px;max-width:0px;"></td>
<td align="center" style="mso-line-height-rule:exactly;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;font-family:'MrsEavesOT-Roman', 'times new roman', serif;color:#ffffff !important;padding:10px 0;" class="nav-block"><span style="color:#ffffff; text-decoration:none;">SHOP MEN</span>
</td>
<td class="hide"> </td>
<td class="hide" width="1" bgcolor="#FFFFFF" style="font-size:0px;line-height:0px;display:none;height:0px;width:0px;max-height:0px;max-width:0px;"></td>
<td align="center" style="mso-line-height-rule:exactly;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;font-family:'MrsEavesOT-Roman', 'times new roman', serif;color:#ffffff !important;" class="hide"><span style="color:#ffffff; text-decoration:none;">SUPPORTIVE TECHNOLOGY</span>
</td>
</tr>
</table>
</td>
<td width="37" class="hide"></td>
</tr>
</table>
<!-- end header nav -->
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- /header wrapper -->
<!-- body wrapper -->
<table width="100%" bgcolor="#F9F8F8" cellpadding="0" cellspacing="0" border="0" style="padding:0;margin:0;border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;"><!-- table-layout:fixed;
--> <tr>
<td align="center">
<table width="600" align="center" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;min-width:300px !important;" bgcolor="#ffffff" class="width320">
<!-- full-width copy -->
<tr>
<td colspan="2" style="min-width:300px !important;">
<p style="margin:25px auto 0px;padding:0;font-family:'SackersGothicStd-Medium', sans-serif;font-size:22px;line-height:140%;letter-spacing:1px;color:#000000;text-align:center;text-transform:uppercase;font-weight:500;width:95%;">Step out in subtle chic</p>
<p style="margin:0px auto 15px;padding:0;font-family:gothamy, 'helvetica neue', helvetica, arial, sans-serif;font-size:14px;font-style:normal !important;line-height:150%;letter-spacing:1px;color:#000000;text-align:center;width:76%;">Available in bright colours and warm neutrals, our new sandals go everywhere you do, from sunrise to sunset.</p>
</td>
</tr>
<!-- end full-width copy -->
<!-- full-width cta -->
<tr>
<td colspan="2" style="min-width:300px !important;">
<table class="width320nav" align="center" border="0" cellpadding="5" cellspacing="0" width="100%">
<tr>
<td align="center" style="color:#ffffff;padding:15px 0 0;text-align:center;" mc:edit="herbutton">
<table align="center" border="0" cellpadding="0" cellspacing="0" style="max-width:200px;min-width:200px;" width="200">
<tbody>
<tr>
<td align="center" style="max-width:300px;display:block !important;background-color:#ffffff;border:1px solid #000000;padding:10px;font-family:'SackersGothicStd-Medium', sans-serif;font-size:12px;font-weight:500;line-height:105%;letter-spacing:1px;text-align:center;">SHOP SANDALS
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</table>
<!-- end button -->
</td>
</tr>
<!-- three-column content -->
<tr>
<td colspan="2" style="min-width:300px !important;">
<table class="width320" align="left" border="0" cellpadding="0" cellspacing="0" width="32%">
<tr>
<td align="center">
<img border="0" class="width320" src="https://gallery.mailchimp.com/df9c3a35085c40dd1033b83bf/images/4f936c5d-aec4-407b-bc0e-a6b668abc01f.jpg" style="max-width: 196px; margin: auto; padding: 0" width="196" alt="Coming Soon: Lorne">
</td>
</tr>
</table>
<table class="width320" align="left" border="0" cellpadding="0" cellspacing="0" width="32%">
<tr>
<td align="center">
<img border="0" class="width320" src="https://gallery.mailchimp.com/df9c3a35085c40dd1033b83bf/images/95cd618b-6e44-4879-9f3b-fad394664080.jpg" style="max-width: 196px; margin: auto; padding: 0" width="196" alt="Kirra">
<!-- <p style="margin:10px auto;padding:0;font-family:'MrsEavesOT-Italic', 'times new roman', serif;font-size:12px;line-height:120%;letter-spacing:1px;color:#000000;text-align:center;"><a href="https://vionicshoes.ca/products/kirrasandal" style="font-size:12px;color:#ff4621;text-decoration:none;"><span style="font-size: 12px; color: #ff4621; text-decoration:none">
<i>NEW! <span style="color: #000">Kirra</span>
</i></span></a>
</p>-->
</td>
</tr>
</table>
<table class="width320" align="left" border="0" cellpadding="0" cellspacing="0" width="32%">
<tr>
<td align="center">
<img border="0" class="width320" src="https://gallery.mailchimp.com/df9c3a35085c40dd1033b83bf/images/ecc64309-c40e-407d-af58-62b95e975d2b.jpg" style="max-width: 196px; margin: auto; padding: 0" width="196" alt="Catalina">
</td>
</tr>
</table>
</td>
</tr>
<!-- end three-column content -->
<!--
<tr>
<td height="10" colspan="2">
</td>
</tr>
-->
<!-- end spacer -->
<!-- Full width image-->
<tr>
<td colspan="2" style="min-width:300px !important;">
<table class="width320" align="left" border="0" cellpadding="0" cellspacing="0" width="96%">
<tr>
<td align="center"><img border="0" class="width320" src="https://gallery.mailchimp.com/df9c3a35085c40dd1033b83bf/images/0f605e1b-bdfc-43fb-9736-c9774b41cc78.jpg" style="max-width: 96%; width: 588px; margin: auto; padding: 0" alt="Bella">
</td>
</tr>
</table>
</td>
</tr>
<!-- three-column content -->
<tr>
<td colspan="2" style="min-width:300px !important;">
<table class="width320" align="left" border="0" cellpadding="0" cellspacing="0" width="32%">
<tr>
<td align="center"><img border="0" class="width320" src="https://gallery.mailchimp.com/df9c3a35085c40dd1033b83bf/images/218d016f-850b-4484-be39-812c898b9de2.jpg" style="max-width: 196px; margin: auto; padding: 0" width="196" alt="Bella">
</td>
</tr>
</table>
<table class="width320" align="left" border="0" cellpadding="0" cellspacing="0" width="32%">
<tr>
<td align="center"><img border="0" class="width320" src="https://gallery.mailchimp.com/df9c3a35085c40dd1033b83bf/images/a9f43d2c-aaeb-4128-906c-22c2ec0e7f13.jpg" style="max-width: 196px; margin: auto; padding: 0" width="196" alt="Bella">
</td>
</tr>
</table>
<table class="width320" align="left" border="0" cellpadding="0" cellspacing="0" width="32%">
<tr>
<td align="center"><img border="0" class="width320" src="https://gallery.mailchimp.com/df9c3a35085c40dd1033b83bf/images/4cf6b46c-208b-4497-bca1-44c3c6418808.jpg" style="max-width: 196px; margin: auto; padding: 0" width="196" alt="Bella">
</td>
</tr>
</table>
</td>
</tr>
<!-- end three-column content -->
<!-- three-column content -->
<tr>
<td colspan="2" style="min-width:300px !important;">
<table class="width320" align="left" border="0" cellpadding="0" cellspacing="0" width="32%">
<tr>
<td align="center"><img border="0" class="width320" src="https://gallery.mailchimp.com/df9c3a35085c40dd1033b83bf/images/2d57acb7-f623-4f49-90ab-0250e704a248.jpg" style="max-width: 196px; margin: auto; padding: 0" width="196" alt="Midi Perf">
</td>
</tr>
</table>
<table class="width320" align="left" border="0" cellpadding="0" cellspacing="0" width="32%">
<tr>
<td align="center"><img border="0" class="width320" src="https://gallery.mailchimp.com/df9c3a35085c40dd1033b83bf/images/b885ec53-341d-4018-8e73-f097c3ec682a.jpg" style="max-width: 196px; margin: auto; padding: 0" width="195" alt="Joey">
</td>
</tr>
</table>
<table class="width320" align="left" border="0" cellpadding="0" cellspacing="0" width="32%">
<tr>
<td align="center"><img border="0" class="width320" src="https://gallery.mailchimp.com/df9c3a35085c40dd1033b83bf/images/7bc1b19f-f704-458a-8869-9c20b5b2f4dd.jpg" style="max-width: 196px; margin: auto; padding: 0" width="196" alt="Edie">
</td>
</tr>
</table>
</td>
</tr>
<!-- end three-column content -->
<!-- Full width image-->
<tr>
<td colspan="2" style="min-width:300px !important;">
<table class="width320" align="left" border="0" cellpadding="0" cellspacing="0" width="96%">
<tr>
<td align="center"><img border="0" class="width320" src="https://gallery.mailchimp.com/df9c3a35085c40dd1033b83bf/images/9a07d8b5-7e12-4540-b882-007774b799bd.jpg" style="max-width: 96%; width: 588px; margin: auto; padding: 0" alt="Bella">
</td>
</tr>
</table>
</td>
</tr>
<!-- <td height="30" colspan="2">
</td>-->
<!-- end spacer -->
</table>
</td>
</tr>
</table>
<!-- /body wrapper -->
<!-- footer wrapper -->
<table width="100%" bgcolor="#F9F8F8" cellpadding="0" cellspacing="0" border="0" style="padding:0;margin:0;border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;table-layout:fixed;">
<tr>
<td align="center">
<table width="600" bgcolor="#373131" align="center" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;text-align:center;" class="width320">
<tr>
<td colspan="2" class="width320">
<table width="600" bgcolor="#000000" align="center" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;color:#444444;font-family:gothamy, 'helvetica neue', helvetica, arial, sans-serif;font-size:10px;text-align:center;" class="width320">
<tr>
<td height="20" width="100%"></td>
</tr>
<!-- spacing -->
<!-- footer nav 1 -->
<tr align="center">
<td>
<table align="center" width="320" border="0" cellpadding="0" cellspacing="0" style="color:#ffffff;font-family:gothamy, 'helvetica neue', helvetica, arial, sans-serif;font-size:12px;">
<tr>
<td align="center"><span class="block"><span style="color:#ffffff; text-decoration:none;">30-DAY WEAR TEST</span> | <span style="color:#ffffff; text-decoration:none;">FIND A STORE</span></span>
</td>
</tr>
</table>
</td>
</tr>
<!-- end footer nav 1 -->
<tr>
<td height="5" width="100%"></td>
</tr>
<!-- spacing -->
<!-- footer nav 2 -->
<tr>
<td width="100%">
<table width="100%" align="center" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;" class="width320nav">
<tr>
<td align="center" style="color:#ffffff;font-family:gothamy, 'helvetica neue', helvetica, arial, sans-serif;font-size:10px;text-align:center;"><span class="block"><span style="color:#ffffff; text-decoration:none;">FAQ</span> | <span style="color:#ffffff; text-decoration:none;">CONTACT US</span> | <span style="color:#ffffff; text-decoration:none;">UNSUBSCRIBE</span></span>
</td>
</tr>
</table>
</td>
</tr>
<!-- end footer nav 2 -->
<!-- social -->
<tr>
<td width="100%" class="width320">
<div align="center" mc:edit="socialicons" style="margin:10px auto;padding:0;">
<img src="https://gallery.mailchimp.com/f65fdf760c91701e37252f426/images/4f0797d7-defb-47de-a41d-7f5da63c3274.png" width="20" border="0" title="Facebook" alt="4f0797d7-defb-47de-a41d-7f5da63c3274.png"> <img src="https://gallery.mailchimp.com/f65fdf760c91701e37252f426/images/b94436f2-347d-4781-bcfa-7f51c0e7460f.png" width="20" border="0" title="Instagram" alt="b94436f2-347d-4781-bcfa-7f51c0e7460f.png"> <img src="https://gallery.mailchimp.com/f65fdf760c91701e37252f426/images/4d973ac0-a4a5-42a4-963d-7deddc0b127f.png" width="20" border="0" title="Twitter" alt="4d973ac0-a4a5-42a4-963d-7deddc0b127f.png">  <img src="https://gallery.mailchimp.com/f65fdf760c91701e37252f426/images/1b8863d9-8cce-46f3-8fce-aeb3281581b6.png" width="20" border="0" title="Youtube" alt="1b8863d9-8cce-46f3-8fce-aeb3281581b6.png">
</div>
</td>
</tr>
<!-- end social -->
<tr>
<td height="10" width="100%"></td>
</tr>
<!-- spacing -->
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="center">
<table width="600" bgcolor="#ffffff" align="center" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;color:#444444;font-family:gothamy, 'helvetica neue', helvetica, arial, sans-serif;font-size:10px;text-align:center;" class="width320">
<!-- company info -->
<tr align="center">
<td width="600" align="center">
<br><span style="color:#000000">© *|CURRENT_YEAR|* *|LIST:COMPANY|*. All rights reserved.</span>
<br><span style="color:#000000; text-decoration:none;">*|HTML:LIST_ADDRESS_HTML|*</span>
</td>
</tr>
<!-- end company info -->
<tr>
<td height="20" bgcolor="#ffffff"></td>
</tr>
<!--spacer -->
</table>
</td>
</tr>
</table>
<!-- /footer wrapper -->
<!-- gmail ios fix -->
<div style="display:none !important;white-space:nowrap;font:15px courier;color:#ffffff;"> - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - </div>
</body>
I managed to fix a few things but you will have to work on it more. The easy fixes are:
The image with lady and 30 day wear test didnt have a width on the img tag. Outlook doesnt like retina images so always use image widths for those that will extend beyond your template width.
Lady image fix:
<table class="width320" align="center" border="0" cellpadding="0" cellspacing="0" width="96%">
<tr>
<td align="center"><img border="0" class="width320" src="https://gallery.mailchimp.com/df9c3a35085c40dd1033b83bf/images/0f605e1b-bdfc-43fb-9736-c9774b41cc78.jpg" style="max-width: 96%; width: 588px; margin: auto; padding: 0; display:block;" alt="Bella" width="588">
</td>
</tr>
</table>
Bottom image fixed:
<table class="width320" align="center" border="0" cellpadding="0" cellspacing="0" width="96%">
<tr>
<td align="center"><img border="0" class="width320" src="https://gallery.mailchimp.com/df9c3a35085c40dd1033b83bf/images/9a07d8b5-7e12-4540-b882-007774b799bd.jpg" style="max-width: 96%; width: 588px; margin: auto; padding: 0; display:block;" alt="Bella" width="588">
</td>
</tr>
</table>
Things to note:
You are missing display blocks on images
Once all above fixes are placed in there are white lines between images, you will need to see the images are right sizes and resized the right way to eliminate the annoying lines.
Full fixed code of email can be found here.
Hope this is the answer you were after.

How to align images for yahoo mail

Hello every one I want to align my social icon images for yahoo mail I try many thing but result is same I also try table-layout:fixed; style but my images still showing on left align any one help me out from this problem my code snippet is below
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link href='https://fonts.googleapis.com/css?family=Abel' rel='stylesheet' type='text/css'>
<title>My Promo | Email</title>
<style type="text/css">
body {background-color:#fcfcfc;}
/* Client-specific Styles */
div, p, a, li, td { -webkit-text-size-adjust:none; }
#outlook a {padding:0;} /* Force Outlook to provide a "view in browser" menu link. */
html{width: 100%; }
body{width:100% !important; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; margin:0; padding:0;}
/* Prevent Webkit and Windows Mobile platforms from changing default font sizes, while not breaking desktop design. */
.ExternalClass {width:100%;} /* Force Hotmail to display emails at full width */
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;} /* Force Hotmail to display normal line spacing. */
#backgroundTable {margin:0; padding:0; width:100% !important; line-height: 100% !important;}
img {outline:none; text-decoration:none;border:none; -ms-interpolation-mode: bicubic;}
a img {border:none;}
.image_fix {display:block;}
p {margin: 0px 0px !important;}
table td {border-collapse: collapse;}
table { border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; }
a {color: #33b9ff;text-decoration: none;text-decoration:none!important;}
.punch{font-size:22px;color:#32fac9;line-height: 1;}
/*STYLES*/
table[class=full] { width: 100%; clear: both; }
/*IPAD STYLES*/
#media only screen and (max-width: 640px) {
a[href^="tel"], a[href^="sms"] {
text-decoration: none;
color: #33b9ff; /* or whatever your want */
pointer-events: none;
cursor: default;
}
.mobile_link a[href^="tel"], .mobile_link a[href^="sms"] {
text-decoration: default;
color: #33b9ff !important;
pointer-events: auto;
cursor: default;
}
table[class=devicewidth] {width: 440px!important;text-align:center!important;}
table[class=devicewidthinner] {width: 420px!important;text-align:center!important;}
img[class=banner] {width: 440px!important;height:220px!important;}
img[class=col2img] {width: 440px!important;height:220px!important;}
.punch{font-size:22px;color:#32fac9;line-height: 1;}
}
/*IPHONE STYLES*/
#media only screen and (max-width: 480px) {
a[href^="tel"], a[href^="sms"] {
text-decoration: none;
color: #33b9ff; /* or whatever your want */
pointer-events: none;
cursor: default;
}
.mobile_link a[href^="tel"], .mobile_link a[href^="sms"] {
text-decoration: default;
color: #33b9ff !important;
pointer-events: auto;
cursor: default;
}
table[class=devicewidth] {width: 100%!important;text-align:center!important;}
table[class=devicewidthinner] {width: 100%!important;text-align:center!important;}
img[class=banner] {width: 280px!important;height:94px!important;}
img[class=col2img] {width: 280px!important;height:100px!important;margin-left:0px!important;margin-right:0px!important;}
.punch{font-size:19px;color:#32fac9;line-height: 1;}
}
</style>
</head>
<body>
<!-- Start of preheader -->
<table width="100%" bgcolor="#fcfcfc" cellpadding="0" cellspacing="0" border="0" id="backgroundTable" st-sortable="preheader" >
<tbody>
<tr>
<td>
<table width="600" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
<tbody>
<tr>
<td width="100%">
<table width="600" bgcolor="#eeeeee" cellpadding="0" cellspacing="0" align="center" class="devicewidth">
<tbody>
<!-- Spacing -->
<tr>
<td width="100%" height="20"></td>
</tr>
<!-- Spacing -->
<tr>
<td width="100%" align="left" valign="middle" style="font-family: Helvetica, arial, sans-serif; font-size: 13px;color: #000" st-content="preheader">
Can't see this Email? View it in your Browser
</td>
</tr>
<!-- Spacing -->
<tr>
<td width="100%" height="20"></td>
</tr>
<!-- Spacing -->
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<!-- End of preheader -->
<!-- Start of header -->
<table width="100%" bgcolor="#fcfcfc" cellpadding="0" cellspacing="0" border="0" id="backgroundTable" st-sortable="postfooter" >
<tbody>
<tr>
<td>
<table width="600" bgcolor="#242740" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
<tbody>
<tr>
<td width="500" height="50" align="center" style="font-size:19px;color:#32fac9;line-height: 1;">
My Punch Line
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<!-- End of Header -->
<!-- Start of seperator -->
<!-- End of seperator -->
<!-- Start of main-banner -->
<table width="100%" bgcolor="#fcfcfc" cellpadding="0" cellspacing="0" border="0" id="backgroundTable" st-sortable="banner">
<tbody>
<tr>
<td>
<table width="600" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
<tbody>
<tr>
<td width="100%">
<table width="600" bgcolor="242740" align="center" cellspacing="0" cellpadding="0" border="0" class="devicewidth">
<tbody>
<tr>
<!-- start of image -->
<td align="center" st-image="banner-image">
<div class="imgpop">
<a target="_blank" href="#"><img width="517" border="0" height="159" alt="" border="0" style="display:block; border:none; outline:none; text-decoration:none;" src="img/banner.png" class="banner"></a>
</div>
</td>
</tr>
</tbody>
</table>
<!-- end of image -->
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<!-- End of main-banner -->
<!-- Start of seperator -->
<!-- End of seperator -->
<!-- Start of Left Image -->
<!-- End of Left Image -->
<!-- Start of seperator -->
<!-- End of seperator -->
<!-- start of Full text -->
<table width="100%" bgcolor="#fcfcfc" cellpadding="0" cellspacing="0" border="0" id="backgroundTable" st-sortable="full-text">
<tbody>
<tr>
<td>
<table width="600" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
<tbody>
<tr>
<td width="100%">
<table bgcolor="#fff" width="600" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
<tbody>
<!-- Spacing -->
<tr>
<td height="20" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;"> </td>
</tr>
<!-- Spacing -->
<tr>
<td>
<table width="560" align="center" cellpadding="0" cellspacing="0" border="0" class="devicewidthinner">
<tbody>
<!-- Title -->
<tr>
<td style="font-family: Helvetica, arial, sans-serif; font-size: 20px; color: #282828; text-align:center; line-height: 24px;">
Hello (Mr Name)
</td>
</tr>
<!-- End of Title -->
<!-- spacing -->
<tr>
<td width="100%" height="15" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;"> </td>
</tr>
<!-- End of spacing -->
<!-- content -->
<tr>
<td style="font-family: Helvetica, arial, sans-serif; font-size: 18px; color: #636363; line-height: 24px; text-align: left;padding:0 10px;">
Email Body
</td>
</tr>
<!-- End of content -->
</tbody>
</table>
</td>
</tr>
<!-- Spacing -->
<tr>
<td height="20" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;"> </td>
</tr>
<!-- Spacing -->
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<!-- End of Full Text -->
<!-- Start of seperator -->
<!-- End of seperator -->
<!-- Start of footer -->
<table width="100%" bgcolor="#fcfcfc" cellpadding="0" cellspacing="0" border="0" id="backgroundTable" st-sortable="footer">
<tbody>
<tr>
<td>
<table width="600" bgcolor="#eacb3c" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
<tbody>
<tr>
<td width="100%">
<table bgcolor="#eee" width="600" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
<tbody>
<!-- Spacing -->
<tr>
<td height="10" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;"> </td>
</tr>
<!-- Spacing -->
<tr>
<td>
<!-- Social icons -->
<table width="150" align="center" border="0" cellpadding="0" cellspacing="0" class="devicewidth">
<tbody>
<tr>
<td width="43" height="43" align="center">
<div class="imgpop">
<a target="_blank" href="#">
<img src="img/facebook.png" alt="facebook" border="0" width="43" height="43" style="display:block; border:none; outline:none; text-decoration:none;">
</a>
</div>
</td>
<td align="left" width="20" style="font-size:1px; line-height:1px;"> </td>
<td width="43" height="43" align="center">
<div class="imgpop">
<a target="_blank" href="#">
<img src="img/twitter.png" alt="twitter" border="0" width="43" height="43" style="display:block; border:none; outline:none; text-decoration:none;">
</a>
</div>
</td>
</tr>
</tbody>
</table>
<!-- end of Social icons -->
</td>
</tr>
<!-- Spacing -->
<tr>
<td height="10" style="font-size:1px; line-height:1px; mso-line-height-rule: exactly;"> </td>
</tr>
<!-- Spacing -->
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<!-- End of footer -->
<!-- Start of Postfooter -->
<table width="100%" bgcolor="#fcfcfc" cellpadding="0" cellspacing="0" border="0" id="backgroundTable" st-sortable="postfooter" >
<tbody>
<tr>
<td>
<table width="600" bgcolor="#242740" cellpadding="0" cellspacing="0" border="0" align="center" class="devicewidth">
<tbody>
<!-- Spacing -->
<tr>
<td width="100%" height="20"></td>
</tr>
<!-- Spacing -->
<tr>
<td align="center" valign="middle" style="font-family: Helvetica, arial, sans-serif; font-size: 13px;color: #282828" st-content="preheader">
<span style="font-size:17px;color:#fff;display:inline-block">
Read about our
<a target="_blank" style="color:#d73914;text-decoration:none" href="http://some.com/my-terms.html">policy.</a>
</span>
</td>
</tr>
<tr>
<td align="center" valign="middle" style="font-family: Helvetica, arial, sans-serif; font-size: 13px;color: #282828" st-content="preheader">
<span style="font-size:12px;color:#fff;display:inline-block"> © 2015 all rights reserved.
<br>
www.some.com
</span>
</td>
</tr>
<!-- Spacing -->
<tr>
<td width="100%" height="20"></td>
</tr>
<!-- Spacing -->
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<!-- End of postfooter -->
</body>
</html>
Social icons looks great in normal html, gmail, outlook but not in yahoo my required email is yahoo in yahoo social icons view at left align not in current align i.e centere.
thanks in advance

HTML- Table is wider than specified and content contained inside of it

I will post my HTML, but I'm not sure how the first table (which contains all subsequent tables) is always an additional 2-3 pixels wider than the rest of the content. I have spent the last 2 hours troubleshooting what I believe should be an easy fix... but I can't seem to find any other areas that may be causing the problem. I apologize if the solution is obvious, I haven't designed a website since I was in high school so my skills are a little rusty/aged.
<html>
<head>
<title>Piedmont Wealth Solutions</title>
<style type="text/css"><!--
a:link {
color:000000; font-face:arial; font-size:10pt; text-decoration:none
}
a:visited {
color:000000; font-face:arial; font-size:10pt; text-decoration:none
}
a:active {
color:000000; font-face:arial; font-size:10pt; text-decoration:none
}
a:hover {
color:000000; font-face:arial; font-size:10pt; text-decoration:underline
}
body {
color:Body; font-size:10pt; font-family:Arial;
}
td {
color:Body; font-size:10pt; font-family:Arial
}
--></style>
</head>
<body bgcolor="e9e9e9" background="page_bg.gif" font face="arial" size="10" valign="top" topmargin="0" leftmargin="180">
<table width="537" cellspacing="0" cellpadding="0" valign="top" align="left" height="100%" border="0" bgcolor="265b78">
<tr width="537" valign="top" align="left">
<td valign="top" align="left" width="36" background="table_bg_left.gif">
</td>
<td width="501" valign="top" align="left">
<!------banner/nav----->
<table width="501" valign="top" border="0" align="left" cellpadding="0" cellspacing="0" bgcolor="c5c5c5">
<tr valign="top" align="left" border="0">
<img src="banner_nav.jpg" border="0" valign="top" align="left">
<img src="content_top_spacer.jpg" border="0" valign="top" align="left">
</td>
</tr>
</table>
<!------content------>
<table width="501" height="350" cellspacing="0" cellpadding="0" border="0" align="left">
<tr valign="top" align="left">
<td valign="top" align="left" width="356" bgcolor="f5F8Fa">
<img src="aboutus_header.jpg" border="0" valign="top">
<br>
<br>
Content
</td>
<td valign="top" width="144" bgcolor="f0f3f5">
<img src="news_header.jpg" border="0" align="left" valign="top"> <br><br>
google news feed
</td>
</tr>
</table>
<!------address/disclaimer------>
<table width="501" cellspacing="0" cellpadding="0" height="45%" border="0" valign="top" align="left" bgcolor="265b78">
<tr valign="top" align="left">
<td valign="top" align="left" height="15" bgcolor="aac6d5">
</td>
</tr>
<tr valign="top" align="left">
<td valign="top" align="left" height="15" bgcolor="7da6bc">
</td>
</tr>
<tr valign="top" align="left">
<td valign="top" align="left">
<img src="bottom_disclosure.jpg" align="left" valign="top" border="0">
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
Tables should not be used for layout purposes, that's what CSS is for. Tables are for tabular data. With CSS you have a very nice control over the positioning and dimensions of your content.
Here's a collection of reasons why you should opt for CSS.
This is (IMHO) the best book for a head start.