Html 为什么我的CSS工具提示会向下推我的其他内容？

我有一个CSS工具提示，带有CSS3淡入，z索引设置为999。当我将鼠标悬停在链接上时，工具提示本身会向下推我的其他内容，它应该位于上方，而不是内联，尽管我使用了一个跨距并将其转换为块

这是我想要的一个例子，我如何阻止它向下推内容

---

谢谢。

绝对位置工具提示（将容器的位置设置为相对位置，绝对位置将相对容器）。

是否确保工具提示css位置值为绝对位置？（或者至少不是静态的）。

显示：block

不会从页面流中提取元素，它只是将其推到自己的新行上。使用其他海报推荐的

position:absolute

，应该对你有用

Position:absolute

将为整个浏览器窗口设置一个位置（例如

top:0px；left:20px；

），除非存在设置了

Position:relative

的父级（然后将成为参考点）。第二种类型的一个例子是，在给定的contentdiv中，从右侧精确定位30px的链接，而不管该div在页面上的位置如何

Position:relative

可用于相对于元素在自然页面流中的原始位置定位元素，并在元素所在的位置留下空间<代码>位置：固定可用于滚动页面时不应移动的元素（如固定导航栏、页面品牌或页脚）<代码>位置：静态是默认的位置设置，当您需要覆盖其他位置类型时，应使用该设置

如果在另一个元素中使用span作为工具提示文本，则可能需要将父元素设置为

position:relative

，并将内部span设置为

position:absolute

。您需要设置一个“上”和“左”值，以调整工具提示文本的精确位置（即父元素上方或下方、左侧或右侧）

我希望这是有帮助的