锚链接根据绝对定位元素的高度切断页面

Question

单击锚链接时，会切断页面的一部分。接近我可以告诉它发生在所有浏览器中。

http://jsfiddle.net/PJDWs/

如果你去那个小提琴并点击顶部的链接，你会发现你无法向上滚动到页面顶部。有效地部分页面已被删除。

有几件事导致，但我不知道他们为什么这样做。如果您从overflow: hidden中删除.bodyContent，则表示不会出现此行为。此外，您会注意到截止距离恰好等于top: XXpx上.stuff的值。因此，设置top: 0px也可以解决问题。

问题在于，对于我正在进行的特定设计，这些都不是选项，因为元素需要位于顶部并且父需要溢出隐藏。但更重要的是，为什么会发生这种情况，尤其是为什么它会在所有浏览器中出现......它几乎就像设计一样。

Answer 1

如果删除height:100%;并将其替换为bottom:0;，它将起作用，因为顶部和底部设置的高度然后由封闭容器定义 - 这是一个有趣的错误，但此解决方法将完成工作。