具有位置的元素之间的无用间隙：绝对

Question

我有一个看起来像细节的问题，但我想了解为什么会发生这种情况。 这是关于定位。 我对子元素的绝对位置有top：0 left：0。

position: absolute;
top: 0;
left:0;

1. 为什么子元素扩展x轴和？
2. 为什么子元素在顶部主体的边缘和元素本身（y轴）之间有小的间隙？ ...因为top和left属性设置为零。 here is a demo

Answer 1

1. 因为position:absolute会尝试找到position不是默认值（静态）的祖先。在您的演示中没有这样的祖先，因此#rel的位置与文档根（body元素）相关。

2. #rel有一个defualt保证金值。在margin:0上尝试#rel，然后查看结果

JSFiddle

Answer 2

你必须给段落提供保证金：0，即#rel，所以顶部不会有空格。