Remove spacing between table cells and rows
Add border-collapse: collapse
into the style
attribute value of the inner table
element. You could alternatively add the attribute cellspacing=0
there, but then you would have a double border between the cells.
I.e.:
<table class="main-story-image" style="float: left; width: 180px; margin: 0 25px 25px 25px; border-collapse: collapse">
It looks like the DOCTYPE is causing the image to display as an inline element. If I add display: block
to the image, problem solved.
You have cellspacing="0"
twice, try replacing the second one with cellpadding="0"
instead.
I had a similar problem. This helps me across main email clients. Add:
- attributes
cellpadding="0"
,cellspacing="0"
andborder="0"
to tables - style
border-collapse: collapse;
to tables - styles
padding: 0; margin: 0;
to each element - and styles
font-size: 0px; line-height: 0px;
to each element which is empty