时间戳

首页 > 解决方案 > 电子邮件签名 - 对齐元素

html - 电子邮件签名 - 对齐元素

问题描述

我第一次尝试编写电子邮件签名。我在我的一个tr标签中垂直居中元素时遇到问题。我不能使用flex，我不知道该怎么做。如您所见：idea：图标不在垂直中心

<table cellpadding="0" cellspacing="0" style="width: 100%; max-width: 600px;margin-left:auto;margin-right:auto; padding: 20px; border: none; box-shadow:
        none;font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
        color: #1D1D1B; display: table;">

  <tr>
    <td colspan="3" width="100%" style="background-color:#CB444E; padding: 20px 34px; display: table-cell; vertical-align: middle;">
      <img src="https://www.flaticon.com/svg/vstatic/svg/3176/3176276.svg?token=exp=1612785759~hmac=066a03b72474de481ab5b4bca68a9a5d" alt="" style="width: 20px;">
      <span style="color: #fff; font-size:10px ;">Lorem ipsum dolor sit amet</span>
      <button style="background-color: #fff; border: none; border-radius: 45px; width: 162px;height: 32px;"><a
                        href=""
                        style="text-decoration: none; color: #CB444E; font-weight: bold; font-size: 10px;">Lorem ipsum ipsu</a></button>
    </td>
  </tr>
</table>

标签： htmlcsshtml-table

解决方案

对于居中元素，请尝试align-items或margin-left

要向右移动，请尝试使用float或margin-left

推荐阅读