我正在用 CSS 定位做一些测试，我注意到一个奇怪的行为。
假设我有一个绝对定位的容器 div（红色）。在这个 div 中，我想放置两个块（绿色和蓝色），与容器相对位置。这些块应该粘在顶部并且它们之间有 50 像素的距离，如下所示
所以我想我应该用top:0px; left:0px;第一个，把他放在左上角附近。我在其宽度上添加 50 作为间距，然后得到top:0px; left: 100px;第二个块。（这里是jsfiddle ）。
我没有看到预期的行为，而是得到了这个定位
似乎第二个块top相对于第一个块，而不是父容器。所以第二个块的正确 CSS 代码应该是top: -50px; left: 100px;，就像在这个小提琴中一样。
这不是我第一次注意到这一点。在某些情况下，left财产是有过错的，在这种情况下是top.
无论如何，我知道如何解决这些问题并获得正确的显示，但我不明白为什么它不能像我认为的那样工作。
我很可能误解了整个绝对/相对定位，但我不知道它是什么。