Почему при двойном вложении таблиц, вложенная таблица отображается некорректно?
А именно мне нужно сделать размер ячейки точно равным 21. Я везде задал эту высоту.
Но под картинкой (в ячейке ) появляется место. Итого таблица высотой не 21 пиксель.
Атрибуты cellpadding и cellspacing заданы равными 0.
То есть высота ячейки должна точно совпадать с высотой рисунка и быть 21 пиксель. Но сейчас внизу рисунка есть ещё "свободное место" около 4 пикселей.
Код
<!DOCTYPE html>
<html>
<head>
<title>Заголовок</title>
<meta http-equiv=Content-Type content="text/html;charset=UTF-8">
</head>
<body>
<table width="1000" align="center" cellpadding="0" cellspacing="0" border="0" bgcolor="#535353">
<tr>
<td align="left" bgcolor="red" valign="top">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td width="20"></td>
<td height="21">
<a href="index.php?1"><img src="images/" width="124" height="21" border="0"></a>
</td>
</table>
</td>
</table>
</body>
Как это работает
https://jsfiddle.net/83c42eh1/ 
Простой
