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

Question

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

可以现场查看here

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

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

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

提前致谢。

Answer 1

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

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

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