This post has nothing to do directly with WordPress, but this is a little tip I need to post to remind me how I fixed this particular problem.

Because of restrictions in certain email clients, I still rely on HTML tables for newsletter layouts.  When I cut up an image and place the image slices in individual table cells, the result looks fine in a browser by itself, but when sent and viewed in Gmail, there is a noticeable gap between the rows.

The browser’s element inspector says the row height is computed to 2 pixels larger than the image size despite entering the correct height in the row and cell.

I found entering the line-height attribute set to zero fixes the problem.  In each row tag enter

style=”line-height:0;”

so your row tag looks like <tr style=”line-height:0;”>

You will also need to add line-height attribute to a <p> or <span> tag around your text so it’s not all bunched up together.  Setting line-height to equal or greater than the pixel height of your font-size should do it.