为什么带有边距的p标签不会保留在包含div中？

Question

这可能是一个简单的问题，但为什么下面的段落标记（包括保证金）不能保留在其包含的div中？

<div class="blockone"></div>
<div>
    <p>some text</p>
</div>

.blockone {
    background-color:Red;
    height:100px;
    margin:50px 0px;
}
div p {
    margin:50px 0px;
}

将示例放在jsfiddle

中

http://jsfiddle.net/dr6kN/7/

我期望的是文本和块是否相隔100px？我知道我通过浮动得到这种行为，可以躲避工作，但我正在寻求一些理解：）

Answer 1

我不确定你所说的“包含div”，因为p位于 second div中（底部是透明的） ），因此技术上 在其包含div。

  

我期望的是文本和块是100px分开的吗？

由于collapsing margins，p的边距会折叠到红色div的边距，因此只有红色div的50像素边距显而易见效果。