css - 表格行中的内容不垂直居中

Question

我在 <tr> 中有以下 HTML 电子邮件模板代码元素但内容没有垂直居中，怎么了？

<td data-color="text" data-size="size navigation" data-min="10" data-max="22" data-link-style="text-decoration:none; color:#888;" class="nav" align="center" style="font:12px/16px 'Open Sans', Arial, Helvetica, sans-serif;color:#797c82;padding:0 0 0px;text-align:center;vertical-align:middle">
    Follow us on:
    <a target="_blank" style="text-decoration:none; color:#222; text-transform:uppercase; font-weight:500; letter-spacing:0.02em;" href="#"><img src="https://gallery.mailchimp.com/0a299e4be1a957c04c669703f/images/8c3bae94-bf27-4fc5-b932-9bc1d0b4c424.png" border="0" vspace="0" hspace="0" width="40" height="40" alt="crisalix.com"></a> &nbs
    <a target="_blank" style="text-decoration:none; color:#222; text-transform:uppercase;font-weight:500; letter-spacing:0.02em;" href="#"><img src="https://gallery.mailchimp.com/0a299e4be1a957c04c669703f/images/c658470a-038f-4e90-8bc0-baae91b6ae41.png" border="0" vspace="0" hspace="0" width="40" height="40" alt="crisalix.com"></a>
</td>

Answer 1

将 vertical-align:middle 添加到图像本身。您的   中还缺少一个 p;，但我假设这是一个拼写错误。

<table>
  <tr>
    <td data-color="text" data-size="size navigation" data-min="10" data-max="22" data-link-style="text-decoration:none; color:#888;" class="nav" align="center" style="font:12px 'Open Sans', Arial, Helvetica, sans-serif;color:#797c82;padding:0 0 0px;text-align:center;">
Follow us on:

    <a target="_blank" style="text-decoration:none; color:#222; text-transform:uppercase; font-weight:500; letter-spacing:0.02em;" href="#"><img src="https://gallery.mailchimp.com/0a299e4be1a957c04c669703f/images/8c3bae94-bf27-4fc5-b932-9bc1d0b4c424.png" border="0" vspace="0" hspace="0" width="40" height="40" alt="crisalix.com" style="vertical-align:middle;"></a> &nbsp;
    <a target="_blank" style="text-decoration:none; color:#222; text-transform:uppercase;font-weight:500; letter-spacing:0.02em;" href="#"><img src="https://gallery.mailchimp.com/0a299e4be1a957c04c669703f/images/c658470a-038f-4e90-8bc0-baae91b6ae41.png" border="0" vspace="0" hspace="0" width="40" height="40" alt="crisalix.com" style="vertical-align:middle;"></a>
    </td>
  </tr>
</table>