html - 绝对定位的 div 不起作用

标签 html css

我有一个 css 动画,它使一个 div 位于另一个 div 之下。 DIV 1 位于 DIV 2 之下。如果我将 DIV 2 设为绝对定位,页面将分崩离析。但是如果我不让 DIV 2 绝对定位,DIV 1 就不会在它下面,买留在 div 的顶部。

可以现场查看here

这是在没有对正确内容进行绝对定位的情况下的样子。

如果将鼠标悬停在 map 上,您将看到过渡。

有什么有用的解决方案可以解决这个问题吗?我真的很感激。

提前致谢。

最佳答案

这就是它不起作用的原因,您的父 div 必须有位置才能使子 div 位置生效。

.div1, .div2{
position:relative;
}
.div3{
position:absolute;
}

看这里:https://css-tricks.com/absolute-positioning-inside-relative-positioning/

关于html - 绝对定位的 div 不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31339560/

相关文章:

javascript - 如何使 "div"元素弹出并使屏幕变暗?

javascript - 以表格形式显示选项中的选定值

html - 填充元素时 Bootstrap 网格布局问题

jquery - 如果用户向下滚动页面,第一个标题元素就会消失

html - 如何制作这样的响应式页面?

html - 创建一个褪色列表

带有 html 表的 PHP 计划

html - 将链接添加到 haml 模板中

jquery - Firefox 中的一些链接和表单不可点击

html - 调整浏览器大小时 SVG 图像中的链接消失