I am coding a simple HTML e-mail and I am experiencing strange behaviour in gmail and Outlook 2003 and 2007. There is a white space below all images. My inline styling for images looks like this:
inline by default. That small gap you're seeing is the space for descenders such as those on 'g' and 'q'. To combat the problem, you need to explicitly set all images to be
block elements, like this:
<img src="path/to/img.jpg" style="display:block;" border="0" alt="My Image" />
You can use a service like premailer, which lets you add this style in the
head of your HTML file, and will automatically place it inline for you.
It's worth mentioning that
display:block; will, obviously, mean that each image should be in a separate
td or similar: images that need to display side-by-side will be pushed down below each other.