Outlook Adds Padding To Email Signature Cells
Hello. I'm new to the community. I'm trying to create an email signature and it looks fine in my web browser.
However, when I add it to Outlook, it creates weird padding around my image cells.
I'm not sure what step I'm missing in my code. Can I get some help please?
<html>
<head>
<title>Test Email</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- Save for Web Slices (Test Email.psd) -->
<table id="Table_01" width="510" height="170" border="0" cellpadding="0" cellspacing="0">
<tr>
<td rowspan="7">
<a href=https://www.website.com><img src="https://i.postimg.cc/HnQHs6wP/Email-Test-01.jpg" width="159" height="170" alt=""></td>
<td colspan="2" rowspan="2">
<img src="https://i.postimg.cc/BZDJgnrc/Email-Test-02.jpg" width="313" height="79" alt=""></td>
<td>
<a href=https://www.linkedin.com><img src="https://i.postimg.cc/9FYV6NFD/Email-Test-03.jpg" width="38" height="43" alt=""></td>
<td height="43" nowrap></td>
</tr>
<tr>
<td rowspan="2">
<a href=https://www.facebook.com><img src="https://i.postimg.cc/VL8mHc1y/Email-Test-04.jpg" width="38" height="43" alt=""></td>
<td height="36" nowrap></td>
</tr>
<tr>
<td rowspan="2">
<a href="tel:7777777777"><img src="https://i.postimg.cc/rwycMCKQ/Email-Test-05.jpg" width="110" height="29" alt=""></td>
<td rowspan="2">
<a href="mailto:email@email.com"><img src="https://i.postimg.cc/RZPmF6t9/Email-Test-06.jpg" width="203" height="29" alt=""></td>
<td height="7" nowrap></td>
</tr>
<tr>
<td rowspan="2">
<a href=https://www.youtube.com><img src="https://i.postimg.cc/QMH3W8g7/Email-Test-07.jpg" width="38" height="42" alt=""></td>
<td height="22" nowrap></td>
</tr>
<tr>
<td colspan="2" rowspan="2">
<a href=https://goo.gl/maps><img src="https://i.postimg.cc/Pq9kWgKR/Email-Test-08.jpg" width="313" height="39" alt=""></td>
<td height="20" nowrap></td>
</tr>
<tr>
<td rowspan="2">
<a href=https://www.website.com><img src="https://i.postimg.cc/B6FfMmVQ/Email-Test-09.jpg" width="38" height="42" alt=""></td>
<td height="19" nowrap></td>
</tr>
<tr>
<td colspan="2">
<img src="https://i.postimg.cc/D0KkD19Q/Email-Test-10.jpg" width="313" height="23" alt=""></td>
<td height="23" nowrap></td>
</tr>
</table>
<!-- End Save for Web Slices -->
<div style="background-color:#FFFFFF">
<style>
hr {
height: 1px;
background-color: #9d9d9d;
border: none;
}
div {
padding-top: 5px;
padding-right: 8px;
padding-bottom: 1px;
padding-left: 8px;
}
</style>
<body>
<hr>
<span style="font-size:9pt; font-family: 'Cambria','times new roman','garamond',serif; color:#223488;">This email may contain confidential and/or proprietary information. If you are not the intended addressee or have received this email in error, please inform the sender immediately and destroy this email. Unauthorized copying and/or forwarding of this email is strictly prohibited.
</p>
</div>
</body>
</html>
Hello sam,
Hope you doing well.
We have re-coded the signature & resolved your issue.
Below is code:
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" />
<title>Untitled Document</title>
<style type="text/css">
table {
border-collapse: collapse;
mso-table-lspace: 0px;
mso-table-rspace: 0px;
}
td, a, span {
border-collapse: collapse;
mso-line-height-rule: exactly;
}
p {
padding: 0 !important;
margin: 0 !important;
}
h1, h2, h3, h4, h5, h6 {
display: block;
margin: 0;
}
img {
border: 0;
outline: none;
text-decoration: none;
}
p, a, li, td, blockquote {
mso-line-height-rule: exactly;
}
p, a, li, td, body, table, blockquote {
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
a {
color: inherit;
text-decoration: none;
}
/*assets css start end*/
body {
margin: 0 !important;
padding: 0 !important;
-webkit-text-size-adjust: 100% !important;
-ms-text-size-adjust: 100% !important;
-webkit-font-smoothing: antialiased !important;
}
img + div {
display: none;
}
</style>
</head>
<body bgcolor="#ffffff" style="padding:0; margin:0;">
<table width="510" align="left" border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="top" align="center">
<table width="510" align="left" border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="top" align="left" width="159" style="border-collapse:collapse;padding:0;margin:0;border:none; mso-td-rspace: 0px;mso-line-height-rule: exactly;"><p style="padding:0; margin:0; line-height:1;"><a href="https://www.website.com"><img src="https://i.postimg.cc/HnQHs6wP/Email-Test-01.jpg" width="159" height="170" alt="logo" style="display:block; max-width:159px;" border="0" /></a></p></td>
<td valign="top" align="left" width="313" style="border-collapse:collapse; mso-td-rspace: 0px;padding:0;margin:0;border:none;mso-line-height-rule: exactly;">
<table align="left" width="313" border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="top" align="left" style="border-collapse:collapse;padding:0;margin:0;border:none;mso-td-rspace: 0px;"><p style="padding:0; margin:0; line-height:1;"><a href="https://www.linkedin.com"><img src="https://i.postimg.cc/BZDJgnrc/Email-Test-02.jpg" width="313" height="79" alt="" style="display:block; max-width:313px;" border="0" /></a></p></td>
</tr>
<tr>
<td valign="top" align="left" style="border-collapse:collapse;padding:0;margin:0;border:none;">
<table align="left" width="313" border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="top" align="left" width="110" style="border-collapse:collapse;padding:0;margin:0;border:none;"><p style="padding:0; margin:0; line-height:1;"><a href="tel:7777777777"><img src="https://i.postimg.cc/rwycMCKQ/Email-Test-05.jpg" width="110" height="29" alt="" style="display:block; max-width:110px;" border="0"/></a></p></td>
<td valign="top" align="left" width="203" style="border-collapse:collapse;padding:0;margin:0;border:none;"><p style="padding:0; margin:0; line-height:1;"><a href="mailto:email@email.com"><img src="https://i.postimg.cc/RZPmF6t9/Email-Test-06.jpg" width="203" height="29" alt="" style="display:block;" border="0"/></a></p></td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top" align="left" style="border-collapse:collapse;padding:0;margin:0;border:none;"><p style="padding:0; margin:0; line-height:1;"><a href="https://www.website.com"><img src="https://i.postimg.cc/Pq9kWgKR/Email-Test-08.jpg" width="313" height="39" alt="" style="display:block; max-width:313px;" border="0"/></a></p></td>
</tr>
<tr>
<td valign="top" align="left" style="border-collapse:collapse;padding:0;margin:0;border:none;"><p style="padding:0; margin:0; line-height:1;"><img src="https://i.postimg.cc/D0KkD19Q/Email-Test-10.jpg" width="313" height="23" alt="" style="display:block; max-width:313px;" border="0" /></p></td>
</tr>
</table>
</td>
<td valign="top" align="left" width="38" style="border-collapse:collapse;padding:0;margin:0;border:none;mso-td-rspace: 0px;mso-line-height-rule: exactly;">
<table align="left" width="38" border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="top" align="left" width="38" height="43" style="border-collapse:collapse;padding:0;margin:0;border:none;"><p style="padding:0; margin:0; line-height:1;"><a href="https://www.linkedin.com"><img src="https://i.postimg.cc/9FYV6NFD/Email-Test-03.jpg" width="38" height="43" alt="" style="display:block; max-width:38px;" border="0"></a></p></td>
</tr>
<tr>
<td valign="top" align="left" width="38" height="43" style="border-collapse:collapse;padding:0;margin:0;border:none;"><p style="padding:0; margin:0; line-height:1;"><a href="https://www.facebook.com"><img src="https://i.postimg.cc/VL8mHc1y/Email-Test-04.jpg" width="38" height="43" alt="" style="display:block; max-width:38px;" border="0"></a></p></td>
</tr>
<tr>
<td valign="top" align="left" width="38" height="43" style="border-collapse:collapse;padding:0;margin:0;border:none;"><p style="padding:0; margin:0; line-height:1;"><a href="https://www.youtube.com"><img src="https://i.postimg.cc/QMH3W8g7/Email-Test-07.jpg" width="38" height="43" alt="" style="display:block; max-width:38px;" border="0"></a></p></td>
</tr>
<tr>
<td valign="top" align="left" width="38" height="43" style="border-collapse:collapse;padding:0;margin:0;border:none;"><p style="padding:0; margin:0; line-height:1;"><a href="https://www.website.com"><img src="https://i.postimg.cc/B6FfMmVQ/Email-Test-09.jpg" width="38" height="43" alt="" style="display:block; max-width:38px;" border="0"></a></p></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="15" style="font-size:1px; line-height:1px; height:15px;"> </td>
</tr>
<tr>
<td style="font-size:9pt; font-family: 'Cambria','times new roman','garamond',serif; color:#223488; padding-top:10px; border-top:1px solid #afafaf;">This email may contain confidential and/or proprietary information. If you are not the intended addressee or have received this email in error, please inform the sender immediately and destroy this email. Unauthorized copying and/or forwarding of this email is strictly prohibited.</td>
</tr>
</table>
</body>
</html>
Thanks,
Rahul