css/img-table-vertical-center.html

css/img-table-vertical-center.html

<!doctype html>
<html lang=en>
<head>
<meta charset=utf-8>
<title>Vertical align middle with image and text in table</title>
<style>
span {
background-color: green;
font-size: 40px;
}
</style>
</head>
<body>
<table>
<tbody>
<tr>
<td><img src="../svg/hole.svg" style="vertical-align: middle;"/><span style="vertical-align: middle;">Centered p</span></td>
<td><span>Centered p</span></td>
<tr>
</tbody>
</table>

<p>Single div inside td:</p>
<table>
<tbody>
<tr>
<td><div><img src="../svg/hole.svg" style="vertical-align: middle;"/><span style="vertical-align: middle; margin: 0;">Centered p</span></div></td>
<td><span>Centered p</span></td>
<tr>
</tbody>
</table>
</body>
</html>