我有一个CSS提示框，使用CSS3淡入效果，z-index设置为999。当我悬停在链接上时，提示框会将其他内容向下推，而不是覆盖在上方，尽管我已经使用了span并将其转换为块级元素。
这里提供了一个示例（点击此处），请问如何防止它把内容往下推？
谢谢。
这里提供了一个示例（点击此处），请问如何防止它把内容往下推？
谢谢。
3个回答
6
display:block并不会将元素从页面流中移除，它只是将其推到自己的新行。使用position:absolute - 正如其他帖子所建议的 - 应该适合您。除非有一个具有设置为position:relative的父元素（然后它将成为参考点），否则position:absolute将为浏览器窗口整体设置位置（例如top:0px; left:20px;）。第二种类型的示例是在给定内容div内精确定位链接距离右侧30像素 - 无论该div放置在页面的哪个位置。
position:relative可用于将元素相对于其在自然页面流中的原始位置进行定位，并留下一个空间，其中该元素将被放置。 position:fixed可用于不应在页面滚动时移动的元素（例如固定导航栏、页面品牌或页脚）。 position:static是默认的位置设置，应在需要覆盖另一种位置类型时使用。
如果您在另一个元素中使用span作为工具提示文本 - 您可能希望将父元素设置为position:relative，并将内部span设置为position:absolute。您需要设置一个上和左的值来调整您的工具提示文本确切落在哪里（即在父元素上方或下方，向左或向右）。
希望这有所帮助。
- user304469
5
将提示框的位置绝对化（将容器的位置设置为
relative，则绝对位置将相对于容器而言）。- reko_t
1
我真的以为这不会起作用，但它确实起作用了，谢谢。 - Justin Meskan
1
你确定提示框的 CSS 位置值是绝对定位吗？（或者至少不是静态定位）。
- Fitzchak Yitzchaki
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接