Question : Gmail rendering HTML emails with extra white space

I am trying to send out HTML sliced emails to a large list, and I can't for the life of me get this to display correctly in Gmail. It appears that Gmail is adding white lines that pad the bottom of the table cells.

Here is the code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:



<html><head></head><body><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<table id="Table_01" width="797" align="center" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="width: 796px; height: 247px;" width="797"><a href="http://www.latus-hd.com"><img src="http://www.latus-hd.com/emarket/admin/temp/newsletters/35/bm_5-18-10_01.jpg" vspace="0" width="796" border="0" height="247" hspace="0" /></a></td>
</tr>
<tr>
<td style="width: 796px; height: 248px;"><a href="http://latus-hd.com/email-links/167-service030410.html"><img title="bm_5-18-10_03.jpg" alt="bm_5-18-10_03.jpg" id="BM_4_1_10_03" src="http://www.latus-hd.com/emarket/admin/temp/newsletters/35/bm_5-18-10_03.jpg" vspace="0" width="796" border="0" height="248" hspace="0" /></a></td>
</tr>
<tr>
<td style="width: 455px; height: 240px;"><a href="http://latus-hd.com/email-links/175-motorclothes040110.html"><img title="bm_5-18-10_04.jpg" alt="bm_5-18-10_04.jpg" id="BM_4_1_10_04" src="http://www.latus-hd.com/emarket/admin/temp/newsletters/35/bm_5-18-10_04.jpg" vspace="0" width="455" border="0" height="240" hspace="0" /></a><a href="http://latus-hd.com/email-links/173-parts040110.html"><img title="bm_5-18-10_05.jpg" alt="bm_5-18-10_05.jpg" id="BM_4_1_10_05" src="http://www.latus-hd.com/emarket/admin/temp/newsletters/35/bm_5-18-10_05.jpg" vspace="0" width="341" border="0" height="240" hspace="0" /></a></td>
</tr>
<tr>
<td style="height: 232px;"><img title="bm_5-18-10_05-05.jpg" alt="bm_5-18-10_05-05.jpg" id="BM_5_18_10_05" src="http://www.latus-hd.com/emarket/admin/temp/newsletters/35/bm_5-18-10_05-05.jpg" vspace="0" width="375" border="0" height="232" hspace="0" /><a href="http://latus-hd.com/email-links/177-botm040110.html"><img title="bm_5-18-10_07.jpg" alt="bm_5-18-10_07.jpg" id="BM_4_1_10_07" src="http://www.latus-hd.com/emarket/admin/temp/newsletters/35/bm_5-18-10_07.jpg" vspace="0" width="421" border="0" height="232" hspace="0" /></a></td>
</tr>
</tbody>
</table></body></html>

Attachments:

Screen-shot-2010-05-18-at-4.10.4.jpg (422 KB) (File Type Details)

Rendered in Gmail

Screen-shot-2010-05-18-at-4.11.0.jpg (342 KB) (File Type Details)

Rendered in Apple Mail

Answer : Gmail rendering HTML emails with extra white space

You need to give the images a display:block style
When sending EDMs images should be given a display:block to eliminate the white space added to the table cell after the image

Try the below code

Cheers

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:



<html>
<head>
</head>
<body>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <table id="Table_01" width="797" align="center" border="0" cellpadding="0" cellspacing="0">
        <tbody>
            <tr>
                <td style="width: 796px; height: 247px;" width="797">
                    <a href="http://www.latus-hd.com"><img src="http://www.latus-hd.com/emarket/admin/temp/newsletters/35/bm_5-18-10_01.jpg" vspace="0" width="796" border="0" height="247" hspace="0" style="display:block" alt="" /></a>
                </td>
            </tr>
            <tr>
                <td style="width: 796px; height: 248px;">
                    <a href="http://latus-hd.com/email-links/167-service030410.html"><img title="bm_5-18-10_03.jpg" alt="bm_5-18-10_03.jpg" id="BM_4_1_10_03" src="http://www.latus-hd.com/emarket/admin/temp/newsletters/35/bm_5-18-10_03.jpg" vspace="0" width="796" border="0" height="248" hspace="0" style="display:block" /></a>
                </td>
            </tr>
            <tr>
                <td style="width: 455px; height: 240px;">
                    <a href="http://latus-hd.com/email-links/175-motorclothes040110.html"><img title="bm_5-18-10_04.jpg" alt="bm_5-18-10_04.jpg" id="BM_4_1_10_04" src="http://www.latus-hd.com/emarket/admin/temp/newsletters/35/bm_5-18-10_04.jpg" vspace="0" width="455" border="0" height="240" hspace="0" style="display:block" /></a>
                    <a href="http://latus-hd.com/email-links/173-parts040110.html"><img title="bm_5-18-10_05.jpg" alt="bm_5-18-10_05.jpg" id="BM_4_1_10_05" src="http://www.latus-hd.com/emarket/admin/temp/newsletters/35/bm_5-18-10_05.jpg" vspace="0" width="341" border="0" height="240" hspace="0" style="display:block" /></a>
                </td>
            </tr>
            <tr>
                <td style="height: 232px;">
                    <img title="bm_5-18-10_05-05.jpg" alt="bm_5-18-10_05-05.jpg" id="BM_5_18_10_05" src="http://www.latus-hd.com/emarket/admin/temp/newsletters/35/bm_5-18-10_05-05.jpg" vspace="0" width="375" border="0" height="232" hspace="0"  style="display:block" />
                    <a href="http://latus-hd.com/email-links/177-botm040110.html"><img title="bm_5-18-10_07.jpg" alt="bm_5-18-10_07.jpg" id="BM_4_1_10_07" src="http://www.latus-hd.com/emarket/admin/temp/newsletters/35/bm_5-18-10_07.jpg" vspace="0" width="421" border="0" height="232" hspace="0"  style="display:block" /></a>
                </td>
            </tr>
        </tbody>
    </table>
</body>
</html>