I've created some newsletters lately and I am surprised I can't get over this issue.
Whenever I use to put in an image, there's always a bit of a space right below the image. This is very stressful when you want to want to put multiple images in a vertical row. There's always this space of about 5px that's added below. I tried with an HTML document with only one table including some pictures, bordercollapse and borderless, but the same issue is still present.
It's only when i put images right next to each other. I experimented in this document, which has this problem I weirdly can't get over it.
Can you see what I can't see? I never had this before, that's why I am so confused!
CSS
table{
-webkit-font-family: Trebuchet MS, Helvetica, Arial, sans-serif;
-msie-font-family: Trebuchet MS, Helvetica, Arial, sans-serif;
-moz-font-family: Trebuchet MS, Helvetica, Arial, sans-serif;
font-family: Trebuchet MS, Helvetica, Arial, sans-serif;
border-collapse: collapse;
color: #ffffff;
border: 0px solid black;
}
HTML
<!DOCTYPE html>
<html>
<head>
<title>Title</title>
</head>
<body>
<table align="center" cellpadding="0" cellspacing="0" border="0" style="width:100%; border-collapse:collapse; padding:0px; margin:0px;">
<tr>
<td style="background-color:#202020"> </td>
<td bgcolor="#ababab" style="width:600px;">
<table bgcolor="#134326" align="center" cellpadding="0" cellspacing="0" border="0" style=" border-collapse:collapse; max-width:600px; padding:0px; margin:0px;"><!--Content-table-->
<tr>
<td>
<img src="WM.jpg"><br>
<img src="WM.jpg">
</td>
</tr>
<tr>
<td>
<img src="WM.jpg">
</td>
</tr>
</table>
</td>
<td style="background-color:#202020;"> </td>
</tr>
</table>
</body>
</html>