我已经尝试了一切 Bootstrap 5 + Bootstrap 图标在 <p> 标签中，我无法使图标与文本垂直对齐

如何解决我已经尝试了一切 Bootstrap 5 + Bootstrap 图标在 <p> 标签中，我无法使图标与文本垂直对齐

我正在尝试做一些非常简单的事情。

我有一个包含在 <p> 标签中的文本和引导程序图标。

我无法将图标与文本垂直对齐。图标始终显示在文本下方。

我到处搜索并尝试了针对类似情况提出的所有解决方案，但没有任何效果。

我使用的代码与引导图标用于展示其图标 here 的代码完全相同。

您可以从我的屏幕截图中看到问题所在：

图标未与文本垂直对齐。

它应该是这样的：

奇怪的是，如果我将 vertical-align: 1px; 设置为图标本身，问题似乎已解决。但这不应该是解决方案，这应该与开箱即用的引导程序一起使用。

我做错了什么？

这是我的代码：

<div class="d-flex justify-content-between">
   <p class="small">
      Combined data
   </p>
   <p class="small">Refresh data <i class="bi bi-linkedin"></i></p>
</div>

感谢您的帮助。