1

So I've been trying to get my HTML email signature to work properly, but every time I paste it into Outlook, it comes out with extra spacing between images. Particularly on the top and bottom of each slice.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style media="screen" type="text/css">
td {line-height:0; font-size: 0.0em; }
img { display: block; float: left; padding: 0; align: absbottom; align: texttop; }
</style>
</head>


<!-- Paste Code Under This Line
_________________________________________________________________________________ -->
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- Save for Web Slices (NEW HTML SIGNATURE-01.png) -->
<table id="Table_01" width="884" height="300" border="0" cellpadding="0" cellspacing="0">
    <tr>
        <td>
            <img src="https://i.postimg.cc/4N8BRj4N/NEW-HTML-SIGNATURE-01-01.jpg" style="display:block" width="442" height="30" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/4xqPmthD/NEW-HTML-SIGNATURE-01-02.jpg" style="display:block" width="34" height="30" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/zGVpzp3w/NEW-HTML-SIGNATURE-01-03.jpg" style="display:block" width="69" height="30" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/MTbmPFrw/NEW-HTML-SIGNATURE-01-04.jpg" style="display:block" width="39" height="30" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/s2WcSXYv/NEW-HTML-SIGNATURE-01-05.jpg" style="display:block" width="69" height="30" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/VvKB1b8H/NEW-HTML-SIGNATURE-01-06.jpg" style="display:block" width="39" height="30" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/j2xQG4G7/NEW-HTML-SIGNATURE-01-07.jpg" style="display:block" width="70" height="30" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/k4dyymsw/NEW-HTML-SIGNATURE-01-08.jpg" style="display:block" width="39" height="30" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/fWCvY19j/NEW-HTML-SIGNATURE-01-09.jpg" style="display:block" width="69" height="30" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/5NtSgp5c/NEW-HTML-SIGNATURE-01-10.jpg" style="display:block" width="14" height="30" alt=""></td>
    </tr>
    <tr>
        <td>
            <img src="https://i.postimg.cc/pX1Y68km/NEW-HTML-SIGNATURE-01-11.jpg" style="display:block" width="442" height="69" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/DwJdkZYB/NEW-HTML-SIGNATURE-01-12.jpg" style="display:block" width="34" height="69" alt=""></td>
        <td>
            <a href="https://www.instagram.com/phantomppf/"><img src="https://i.postimg.cc/g03Vj7ph/NEW-HTML-SIGNATURE-01-13.jpg" style="display:block" width="69" height="69" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/Vkx9Y8x1/NEW-HTML-SIGNATURE-01-14.jpg" style="display:block" width="39" height="69" alt=""></td>
        <td>
            <a href="https://www.linkedin.com/company/phantomppf/"><img src="https://i.postimg.cc/C1NbHfzL/NEW-HTML-SIGNATURE-01-15.jpg" style="display:block" width="69" height="69" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/wvHhmkxG/NEW-HTML-SIGNATURE-01-16.jpg" style="display:block" width="39" height="69" alt=""></td>
        <td>
            <a href="https://www.facebook.com/phantomppf"><img src="https://i.postimg.cc/tRBhsPKB/NEW-HTML-SIGNATURE-01-17.jpg" style="display:block" width="70" height="69" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/d3VrWtyR/NEW-HTML-SIGNATURE-01-18.jpg" style="display:block" width="39" height="69" alt=""></td>
        <td>
            <a href="https://www.phantomppf.com/"><img src="https://i.postimg.cc/kGY8L3Q0/NEW-HTML-SIGNATURE-01-19.jpg" style="display:block" width="69" height="69" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/BQt2Hbs4/NEW-HTML-SIGNATURE-01-20.jpg" style="display:block" width="14" height="69" alt=""></td>
    </tr>
    <tr>
        <td>
            <img src="https://i.postimg.cc/jS7N31L1/NEW-HTML-SIGNATURE-01-21.jpg" style="display:block" width="442" height="92" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/HsKX2ms5/NEW-HTML-SIGNATURE-01-22.jpg" style="display:block" width="34" height="92" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/YSNFMmNf/NEW-HTML-SIGNATURE-01-23.jpg" style="display:block" width="69" height="92" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/BvfFrCFn/NEW-HTML-SIGNATURE-01-24.jpg" style="display:block" width="39" height="92" alt=""></td>
        <td>
            <a href="tel:587-323-6393"><img src="https://i.postimg.cc/rm8rmFQ6/NEW-HTML-SIGNATURE-01-25.jpg" style="display:block" width="69" height="92" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/8ccfRK2t/NEW-HTML-SIGNATURE-01-26.jpg" style="display:block" width="39" height="92" alt=""></td>
        <td>
            <a href="https://www.google.com/maps/dir/50.971999,-114.0390212/8230+Blackfoot+Trail+SE,+Calgary,+AB+T2H+0A7/@50.9735185,-114.0512182,15z/data=!3m1!4b1!4m9!4m8!1m1!4e1!1m5!1m1!1s0x537170dd59e25055:0x50f89b6bfd14e452!2m2!1d-114.0481704!2d50.9807794"><img src="https://i.postimg.cc/SsDzzFvn/NEW-HTML-SIGNATURE-01-27.jpg" style="display:block" width="70" height="92" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/hvYzp8gg/NEW-HTML-SIGNATURE-01-28.jpg" style="display:block" width="39" height="92" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/ryZrVT4b/NEW-HTML-SIGNATURE-01-29.jpg" style="display:block" width="69" height="92" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/rFdtzHCp/NEW-HTML-SIGNATURE-01-30.jpg" style="display:block" width="14" height="92" alt=""></td>
    </tr>
    <tr>
        <td>
            <img src="https://i.postimg.cc/tCLn6z2N/NEW-HTML-SIGNATURE-01-31.jpg" style="display:block" width="442" height="109" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/htTz17YW/NEW-HTML-SIGNATURE-01-32.jpg" style="display:block" width="34" height="109" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/YS74nCc4/NEW-HTML-SIGNATURE-01-33.jpg" style="display:block" width="69" height="109" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/xdPXWVY6/NEW-HTML-SIGNATURE-01-34.jpg" style="display:block" width="39" height="109" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/MTKnw3pq/NEW-HTML-SIGNATURE-01-35.jpg" style="display:block" width="69" height="109" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/3RSdxjkp/NEW-HTML-SIGNATURE-01-36.jpg" style="display:block" width="39" height="109" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/2ygy4zFS/NEW-HTML-SIGNATURE-01-37.jpg" style="display:block" width="70" height="109" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/Kj14kKTW/NEW-HTML-SIGNATURE-01-38.jpg" style="display:block" width="39" height="109" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/8PrjT6NJ/NEW-HTML-SIGNATURE-01-39.jpg" style="display:block" width="69" height="109" alt=""></td>
        <td>
            <img src="https://i.postimg.cc/qBFNfLVH/NEW-HTML-SIGNATURE-01-40.jpg" style="display:block" width="14" height="109" alt=""></td>
    </tr>
</table>
<!-- End Save for Web Slices -->
</body>
</html>






<!-- Keep Pasted Code Above This Line!
_________________________________________________________________________________ -->
</html>

Can anyone help me figure out what's going on with my signature? It looks fine on browser, it just messes up once it goes through Outlook.

Brandon Wong
  • 11
  • 1
  • Have you tried global css resets? each browser (probably outlook too in this case) has their own default settings that might look well on whatever you're testing it on but may not be the case on others. Read [this](https://stackoverflow.com/questions/11578819/css-reset-what-exactly-does-it-do) to understand them a bit more – mah111 Feb 09 '21 at 18:09
  • Hey, thanks for the reply. I haven't tried a global CSS rest (not sure how to do it. I should probably preface this by saying I'm not much of a coder...) I'm currently using Firefox though. Perhaps this is just an issue with my browser not normalizing styles like your link implies? – Brandon Wong Feb 09 '21 at 19:56
  • Hey, I'll admit I've never attempted sending html through e-mail but if you're doing outlook via a browser, you can use the Inspect Element tool (right click) within your browser-outlook – mah111 Feb 09 '21 at 21:00

0 Answers0