3

情况是：

CSS：

<style>
#aux1{
    position:relative;      
    background-color:#ccc;
    width:100%;
    height:200px;
}
#aux2{
    display:block;
    background-color:#F00;
    width:100px;
    height:100px;
    margin:20px;
}

</style>

的HTML：

<html><head></head>
<body>
    "...some content (div with height: auto)"
    <div id="aux1">
        <div id="aux2">
        </div>
    </div>
</body>
</html>

问题是来自 aux2 的 margin 属性的行为很奇怪，如下图所示：

不寻常的边缘照片 1

如果我将溢出：隐藏在 aux1 中，结果趋于正常：

不寻常的边缘照片 2

为什么我什至需要使用溢出：隐藏边距（尤其是边距顶部）才能正常运行？

4

1 回答 1

2

答案是，margin collapsing就像这个问题一样：为什么这种 CSS margin-top 样式不起作用？

另一个问题参考：CSS折叠边距有什么意义？

于 2012-09-09T10:12:11.230 回答