I have this html email signature code, when I send my email signature from Gmail to another platform, it works fine. However, when I send it from Outlook to another platform, the alignment of the embedded image in the middle gets distorted.
<body style="
font-family: 'Inter', sans-serif;
font-family: 'Nunito Sans', sans-serif;
font-family: 'Poppins', sans-serif;
">
<table cellpadding="0" cellspacing="0">
<tbody>
<tr>
<table style="border-spacing: 0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="background-color: #8fc7c1;">
<table style="line-height: 12px;border-spacing: 0;padding: 0px 28px 5px 40px"
cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td
style="font-weight: bold;line-height: 120%;font-size: 20px;color: #ffffff">
abbababa
</td>
</tr>
</tbody>
</table>
<table style="line-height: 12px; border-spacing: 0; padding: 0px 28px 5px 40px; "
cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="font-size: 11px; color: #5a5e6b; letter-spacing: 1.3px">
Pineapples
</td>
</tr>
</tbody>
</table>
<table style="border-spacing: 0; padding: 10px 107px 0px 40px;" cellpadding="0"
cellspacing="0">
<tbody>
<tr>
<td>
<img src="https://dummyimage.com/150x55/000/fff&text=aaaa" alt="Cyber Essentials">
</td>
</tr>
</tbody>
</table>
</td>
<div>
<td>
<table style="border-spacing: 0;" cellpadding="0" cellspacing="0">
<tr>
<td>
<img style=""
src="https://dummyimage.com/150/170/cf1fcf/0011ff&text=enqiwehi2ehiu32r"
alt="" width="168px" />
</td>
</tr>
</table>
</td>
</div>
<td style="background-color: #f6f6f6; padding-left: 24px;">
<table style="line-height: 13.8px; padding-bottom: 5px;border-spacing: 0;"
cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="padding-right: 7.5px">
<img src=""
alt="" />
</td>
<td style="font-weight: 400; font-size: 11px; color: #5a5e6b">
<a href="#"
style="text-decoration: none; color: #4d4c5e">1228 343 222</a>
<!-- |
<a
href="tel:+4407539938874"
style="text-decoration: none; color: #4d4c5e"
>07539 938 874</a
> -->
</td>
</tr>
</tbody>
</table>
<table style="line-height: 13.8px; padding-bottom: 5px; border-spacing: 0;"
cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="padding-right: 7.5px">
<a href="#" target="_blank">
<img src=""
alt="" /></a>
</td>
<td style="font-weight: 400; font-size: 11px; color: #5a5e6b">
<a href="#"
style="text-decoration: none; color: #4d4c5e"
target="_blank">SAWF.com</a>
</td>
</tr>
</tbody>
</table>
<table style="line-height: 13.8px;padding-bottom: 5px; border-spacing: 0"
cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="padding-right: 7.5px">
<a href="#" target="_blank">
<img src=""
alt="" /></a>
</td>
<td style="font-weight: 400; font-size: 11px; color: #5a5e6b">
<a href="#"
style="text-decoration: none; color: #4d4c5e"
target="_blank">[email protected]</a>
</td>
</tr>
</tbody>
</table>
<table style="line-height: 13.8px;padding-bottom: 5px;border-spacing: 0;width: 270px"
cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="padding-right: 7.5px">
<img src=""
alt="" />
</td>
<td
style="font-weight: 400;font-size: 11px;color: #5a5e6b;padding-right: 24px">
H 41 st3
</td>
</tr>
</tbody>
</table>
<table style="line-height: 12px;border-spacing: 0" cellpadding="0" cellspacing="0">
<td style="line-height: 14.4px;font-size: 12px;font-weight: 500;color: #5A5E6B">
Schedule a meeting:
</td>
</table>
<table style="line-height: 13.8px;padding-bottom: 5px;border-spacing: 0" cellpadding="0"
cellspacing="0">
<tbody>
<tr>
<td style="padding-right: 7.5px;">
<a href="#" target="_blank">
<img src=""
alt="" />
</a>
</td>
<td style="font-weight: 400;font-size: 11px;color: #5a5e6b !important">
<a href="#"
style="text-decoration: none; color: #5a5e6b"
target="_blank">abbababab</a>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</tr>
</tbody>
</table>
</body>
</html>
my images are not aligned properly when I send email sigmature from outlook to any other platform.
I want my image alignment properly when I share my email signature from outlook to any other platform.