Search code examples
emailgmailhtml-emailemail-client

Issue with image in table using GMail online client


I am creating an email template to use in Pardot. I have coded the email up. It works fine in OSX Mail, Outlook 07 +, Opera Mail, however GMail is being a real pain. It is adding some weird height or something to the tr or td in my table.

Any suggestions?

<table border="0" cellpadding="0" cellspacing="0" width="228">
    <tbody>
        <tr valign="bottom">
            <td valign="bottom"><span pardot-region=""><img src="widget_top.jpg" alt="Placeholder"></span></td>
        </tr>
        <tr bgcolor="#ffd13f">
            <td style="padding: 10px;">
                <h2><span pardot-region="">Subheading span across one or two lines for best practice:</span></h2>
                <span pardot-region=""><p><b>Date:</b> Thursday 29 November</p>
                <p><b>Time:</b> 1.30pm (GMT)</p>
                <p><b>Where:</b> <a href="http://google.com" style="font-family: Arial; font-weight: normal; text-decoration: underline; font-size: 12px; line-height: 16px; padding-top: 0px; padding-bottom: 5px; color: #F05A00; margin: 0;">Register online &gt;</a></p>                                                                
                <p><b>Topic:</b> Dynamic performance management</p>
                <p><b>Presenters:</b> Octavius Black, CEO and Sebastian Bailey, President</p></span>
            </td>
        </tr>
        <tr valign="top">
            <td valign="top"><span pardot-region=""><img src="widget_bottom.jpg" alt="Placeholder"></span></td>
        </tr>
    </tbody>
</table>

(this table is inside a set of tested tables).

Screen shot can be found here: http://i45.tinypic.com/15wzda9.png

Cheers :)


Solution

  • On the images you have to put (inline)

    style="display:block;"
    

    :)