Have you noticed Gmail ruining your beautiful HTML emails? Are mysterious gaps appearing between your images? Well fear not, there’s an easy fix.

Recently, Google made a change to the way Gmail handles images in HTML-formatted emails. I’ll probably never know why they did this, but I’m sure there was a good reason. This doesn’t change the fact that it has caused problems for many people, like myself, that create and send emails.  As a result of Google’s change to Gmail, any image in your email that is supposed to fit tightly against another image will now show a horizontal gap.

While both Hotmail and Gmail have the same issue, you’ll need to do some extra work for Gmail since it ignores style definitions that are not “inline”. Like I said earlier, it’s quite easy to fix. You’ll just need to add style=”display:block” into the “img” tag for any images that you want to make sure have no gaps or spacing.

Also, don’t forget to go back and check any email templates that you created and tested in the past but are still being sent  to your subscribers. Even though they looked fine even last month, this change could wreak havoc on your design now.

If you have any questions for myself or anyone else on our Marketing team, feel free to send an email to askmarketing@icontact.com.

Hi to all. I was getting mad with this issue because none of the proposed fixes worked for me until I tried to put the images as backgrounds on the tags with his respective size.

Thanks!! I was out of ideas until you laid it out. All hail John Free, King of Gmail Code. :-D

Serious Legend, absolute life saver! This has been plaguing me for a while!

I set an .img style in the header then use http://premailer.dialect.ca to inline all styles used. It works very well and every image then has the block element.

Thanks a Million. This helped me with my html in MailChimp.

Well done for all your hard work in providing this high quality blog.Thanks for sharing such a useful information.

Thank you so much, trying to get sit working to a deadline, and I found this article. You sir, like Will Smith, are Legend.

The fact that so many people have already expressed their gratitude should not stop me from saying the same. This problem was also driving me crazy and your article fixed it perfectly. Thank you so much!!!

I switched the nested table to a parent div, with left floated left divs wrapping the images and that finally solved it.

[...] than the mysterious gaps in the images (they should have read iContact’s post about gaps in Gmail), this is a great email.  It has so many appealing [...