绝对位置div（bootstrap）的Popper.js工具提示位置

Question

我正在尝试在已满的div的右上角创建一个“ info”图标（带有chartist.js图表​​）。为此，我使用绝对跨度为div且其范围为内部的div。

<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>

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

关于在具有引导程序/ HTML / CSS的已经完整的div上添加信息图标的最佳实践是什么，更具体地说，什么是解决此问题的最佳/最简便方法？

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>