html - 绝对位置 div 的 Popper.js 工具提示放置（引导程序）

Question

我正在尝试在已经满的 div 的右上角创建一个“信息”图标（带有 chartist.js 图表）。为此，我使用了一个绝对定位的 div，其中包含 span。

<div class="position-absolute right-0" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="Example Text">
    <span class="mt-2 fas fa-info-circle u-icon"></span>
</div>

不幸的是，这会导致工具提示位置（更重要的是悬停区域）低于实际图标。

在使用 bootstrap/HTML/CSS 的已完整 div 上添加信息图标的最佳实践是什么，更具体地说，解决此问题的最佳/最简单方法是什么？

标签： htmltwitter-bootstraptooltippopper.js

Answer 1

将工具提示放在跨度中：

<div class="position-absolute right-0">
    <span class="mt-2 fas fa-info-circle u-icon"  data-toggle="tooltip" data-placement="bottom" title="" data-original-title="Example Text"></span>
</div>