垂直对齐两个 FontAwesome 图标

问题描述

我有一些简单的代码，其中包含来自 FontAwesome 的两个字体图标。

它们在我的浏览器中呈现如下：

请注意，虽然两个元素的高度均为 16px，但两个图标并未垂直对齐，日历放置在下方

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet"/>
<link href="https://pro.fontawesome.com/releases/v5.15.1/css/all.css" rel="stylesheet"/>


<p>
  <i class="fad fa-times-hexagon text-danger fa-fw"></i>
  <i class="fad fa-fw fa-calendar"></i>
</p>

我可以用 bottom: -1px; 在六边形上“修复”，但有没有更好的方法来对齐基线？

解决方法

这似乎是字体本身定义的字形有问题