After nearly all day of struggling to figure out why a recent HTML email didn’t look right in Gmail, we finally found the answer.
We coded the template and sent out test emails from MailChimp. It looked perfect in Outlook, Hotmail, Yahoo and others, but there were gaps in between tables in Gmail and gaps around some of the images. We used FireBug to try and pinpoint the problem, but even stripping all styles out didn’t work. We even took out all spacing between lines of code. This didn’t solve the layout problems in Gmail either.
We then switched to StreamSend, because we thought it might be some of the styles or other additional code that MailChimp was adding in. Nope. Same thing. HTML Email looked perfect everywhere else, but not Gmail.
After spending nearly the entire day troubleshooting, we finally found the fix.
You have the add a display-block style to every image tag in the email and it will display perfectly in Gmail.
Here is an example image tag with the style added to fix the Gmail issues:
Hopefully this will help you as much as it helped me.