Menu
<html>
<body style="background:grey;">
<table width="500" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="
background-image: url(https://s28.postimg.org/yrbcuftd9/zip.png);
height: 9px;
"></td>
</tr>
<tr>
<td style="
background-image: url(https://s28.postimg.org/yrbcuftd9/zip.png);
height: 9px;
"></td>
</tr><tr>
<td><img width="500" src="https://s28.postimg.org/yrbcuftd9/zip.png"></td>
</tr>
</tbody>
</table>
</body></html>I don't understand why the height of third zip image is 18. Basically, when I add the image as background,there is no gap between each row (No gap between row 1 and row 2). However, when I use image tag, it creates gap between row 2 and row 3. I don't understand why. Any ideas? And also how can I delete the gap between row 2 and there.
508
<img> is considered inline by default, so like other inline elements, it has a line height and space for descenders. Descender space is that little padding under each line that isn't accounted for anywhere, for the hanging bits of letters like in 'p' or 'q'.
If you set it to display: block, everything will click together.
165
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
