Html email issue

Hi

I have this html email http://salafiwales.co.uk/wp-content/uploads/2012/12/sbiic_news5.html

it renders fine in the browser ( or so it seems ) but when you email it out the blue border is broken up with white, see here:
http://salafiwales.co.uk/wp-content/uploads/2012/12/email.jpg

I’ve tried to replace the bgcolor with the blue color but that also makes the white space inside blue and still pushes the 3 boxes down ever so slightly.
I’ve also checked the height and changed the height of the jpeg but that’s not made a difference

How do I get rid of these unwanted white parts?

Many thanks for your help

Welcome to the miserable world of email coding. :frowning: My first thought was add display: block to the images, but you’ve done that. There are known fixes for the various email clients, so it might help if you identify which you are using (though if you are not testing this in other email clients, you are probably in for more nasty surprises).

oh no, I see… I’m using windows live mail desktop although it’s the same with gmail

The gaps don’t show up for me in GMail. I don’t have Windows Live Mail, though.

Edit:

Just downloaded and set up Windows Live Mail and the email renders fine—no gaps. :-/

The spacing issues you are seeing are more common to text-rendering with different email clients, on Windows even though all the fonts are managed by Windows along with anti-aliasing browsers and email clients have their own rendering engine to display that font which causes a host of issues. The easiest and quickest thing you can do is simply take the font size down 1px or remove it temporarily and that will tell you if there is indeed an issue with the overall font size in which cause you will need to stop using images for the sides of your content boxes.

ahh right, interesting, many thanks