Родительский блок .wrapper
имеет высоту 100%. У дочернего блока .info
высота не определена и может быть разной. Как растянуть дочерний блок .wrp
на всю оставшуюся высоту родительского блока .wrapper
?
body,
html {
height: 100%;
margin: 0;
padding: 0;
}
div {
margin: 0;
padding: 0;
}
.wrapper {
display: block;
overflow: hidden;
height: 100%;
width: 100%;
background-color: silver;
}
.wrp {
display: block;
width: 100%;
height: 100%;
background-color: chocolate;
}
.info {
display: block;
width: 100%;
background-color: blue;
}
<div class="wrapper">
<div class="wrp"></div>
<div class="info">Ты видел деву на скале<br />В одежде белой над волнами<br />Когда, бушуя в бурной мгле,<br />Играло море с берегами,<br />Когда луч молний озарял<br />Ее всечасно блеском алым<br />И ветер бился и летал<br />С ее летучим покрывалом?</div>
</div>