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

不知道这是否适合您的情况，但是我只是使用以下CSS属性解决了此问题

#element {

    padding-top: 1px;

    margin-top: -1px;

}

#element被下推，因为它的第一个子元素具有margin-top: 30px。使用此CSS，它现在可以按预期的方式工作：）不确定是否适用于每种情况，YMMV。