CSS: Rand oben, wenn Eltern keinen Rand haben
Wie Sie in sehen könnenDieses BildIch habe eine Orangediv
in einem grünendiv
ohne oberen Rand. Die Orangediv
hat ein30px
oberen Rand, aber es drückt auch das Gründiv
Nieder. Natürlich wird das Problem durch Hinzufügen eines oberen Rahmens behoben, aber ich benötige das Gründiv
randlos sein. Was könnte ich tuen?
.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>
Vielen Dank