固定包装中的绝对定位div

Question

我复制了我的问题的确切背景： 在CodePen和jsFiddle上。

它似乎按照我的预期工作，但当我将相同的样式应用于几乎相同的DOM（还有一些其他元素，但那些没有定位，不应该影响最终结果）我有以下问题：

如你所见。红色框在某种程度上位于顶部div下，即使它位于静态位置。我错过了什么？谢谢！

编辑：我正在尝试获取CodePen或jsFiddle中显示的效果。但是在我的浏览器中，绝对框不会超过固定的div。当用firebug检查时（显示蓝色悬停方块的第二张图像），绝对框就在那里。

Answer 1

这是你在找什么，还是我误解了你的问题？

http://codepen.io/simonaronsson/pen/eiAJd

但是，据我所知 - 整个代码有点乱。你有一个30px的容器，但盒子是200x200？另外：如果你希望它们位于顶部，为什么要将容器和盒子固定在底部？很难理解你的目标是什么。您可能需要更好地描述您真正想要的内容。

或许这就是你的想法？

http://codepen.io/simonaronsson/pen/vxuwd

实际上，我有点迷失了。当你详细说明时，我会尝试改写我的答案。 ：）