A fix to the 1px border/padding added to table cells in Outlook ‘07

I’m going to say it - our monthly newsletter is far from perfect. Thankfully, it gets read by cluey folks like yourself, so we always get amazing feedback and learn something new.

This month’s key takeaway came from @get_dave, who kindly pointed out that Outlook ‘07 was adding a 1px white border/padding to the thumbnails in our design. These thumbnails are enclosed in a table cell with a background color applied, to form a two-tone border. In most email clients, this border is flush with the grey background color:

Normal appearance

But in Outlook ‘07, a white border appears (which also causes the right-side of the border to disappear completely):

Outlook '07

Thankfully, there’s a very elegant fix to this, courtesy of code extraordinaire Ian Hoar. Simply add the following snippet to your CSS styles:

table td { border-collapse: collapse; }

… and voila! No more white border and peace restored to the valley. You can read more about this solution, alongside a couple of other handy email tips on Ian’s blog.

Many thanks again to @get_dave for contributing this cracking tip - hopefully it will save you much hair-pulling when you prepare your newsletters!

Posted by Ros Hodgekiss

3 Comments

  • Jody Gibbons
    25th February

    That’s great we’re currently redesigning our emails and this was exactly what we run into! Tried the fix out and it works a treat, so a timely post!

    Cheers
    Jody

  • Ian Hoar
    3rd March

    Glad the article was of help. This fix isn’t always necessary, but when you get wonky borders it often fixes the issue.

  • exentric
    7th March

    damn was looking for a solution to this for ages

Sign up for free.
Then send campaigns for as little as $9/month

Create an account