CSS：另一个绝对元素中的绝对元素

Question

我创建了一个大div （图1.1中的 div1 ）并将其设置为position: absolute。这个div是页面的内容容器，在这个div里面是所有其他元素。我做隔离这个div的理由是删除浏览器中滚动的反弹：

• Remove bounce on scroll in browser solution

我的问题是，如果我在其中有其他绝对div 。在图1.1 中可以看到带有position:absolute的 div2 ，如果 div1正在滚动，则div2行为就像一个固定的元件。 Div2只是一个例子，我有很多像Popovers这样的绝对元素，不是一个选择。

如何对div2 （在图1.1示例中）说div1滚动与页面滚动一起移动？

代码示例

html, body {
    height: 100%;
    overflow: hidden;
}

.div1 {
   position: absolute;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   overflow: auto;
}

div2{
   position: absolute;
}

图像示例（图1.1）

正确的方式

我知道存在很多相关的答案，但所有这些答案与我的问题完全不同。

相关问题：

• Absolute positioning inside absolute position

• CSS: Absolute Element inside Absolute Element

Answer 1

我有其他解决方案。为了修复iPad过度滚动，我写了一个小脚本，修复了“滚动弹跳”/“过度滚动”

https://github.com/aiboy/PerfectScrollFix

首先，您不需要大幅改变布局并使用绝对div。其次，滚动仍然是“原生的”。

你有两个问题： 1）目前仅支持水平过度滚动修复 2）您的内容（将滚动）应包含在单个元素（包装器）

中

您可以在iPad上测试此脚本：http://jsbin.com/usomob/4

示例http://jsbin.com/usomob/4/edit

的源代码