Как правильно задать высоту родительскому block-1
так, чтобы он был минимум 100px
, но мог растягиваться при наличии большего в нем контента? При этом, дочерний block-2
должен всегда иметь максимальную высоту.
В настоящем исполнении, либо дочерний не растягивается в высоту на 100px
, либо родителю указываем height: 100px;
- дочерний растягивается, но теперь родитель у нас лишь на 100px
в высоту, и рано или поздно контент вылезает за рамки.
.block-1 {
background: blanchedalmond;
padding: 50px 0;
min-height: 100px;
}
.block-1 .block-2 {
height: 100%;
background: azure;
}
<div class="block-1">
<div class="block-2">test</div>
</div>
overflow-y:auto
не сработал.