CSS：当父母无国界时的边际收益

Question

正如您在这张图片中看到的，我在div绿色内部有一个橙色div，没有顶部边框。橙色div具有30px最高边距，但同时也将绿色div压低。当然，添加顶部边框可以解决此问题，但是我需要绿色div无边框。我能做什么？

.body {

    border: 1px solid black;

    border-top: none;

    border-bottom: none;

    width: 120px;

    height: 112px;

    background-color: lightgreen;

}



.body .container {

    background-color: orange;

    height: 50px;

    width: 50%;

    margin-top: 30px;

}


<div class="header">Top</div>

<div class="body">

    <div class="container">Box</div>

</div>

<div class="foot">Bottom</div>

谢谢

Answer 1

您可以添加overflow:auto以.body防止边距崩溃。