Prevent gaps between images in Outlook 2007 – 2013

The Outlook email clients add a spacing above and below images which have a height smaller than 19 pixels.

Keep images at a minimum of 20 pixels in height

The must reliable and best solution is to keep images at least 20 pixels in height and also have the height=”” attribute defined to prevent spacing.

Fix for images smaller than 19 pixels in height

If it’s not possible to increase the height of images contained within your email, you can set line-height and height for each <td> to be the same height as the image it contains:

HTML


  <td width="500" height="300" style="line-height: 300px;"> <img src="http://www.htmlemailcheck.com/assets/img/og-logo.png" width="500" height="300" borde="0" style="display:block; border:0;" /> </td>

Use border-collapse property on tables in your embedded CSS

The border-collapse property will help make sure you don’t have small borders between your sliced images in Outlook 2007, 2010 and 2013.

HTML


  <style type="text/css">
    table {border-collapse: collapse;}
  </style>

Leave a Reply

Your email address will not be published. Required fields are marked *