jojuniori
10/24/2016 - 6:15 PM

#CSS实现一个div里两个div, 一个高度固定, 另一个填满剩下的高度

<style>
.box {
    width: 200px;
    height: 300px;
    background: red;
    position: relative;
}
.el1 {
    height: 100px;
    background: green;
}
.el2 {
    background: blue;
    width: 200px;
    position: absolute;
    top: 100px;
    bottom: 0;
}
</style>
<div class="box">
    <div class="el1"></div>
    <div class="el2"></div>
</div>
<style>
.box {
    width: 200px;
    height: 300px;
    background: red;
}
.el1 {
    height: 100px;
    background: green;
}
.el2 {
    height: calc(100% - 100px);
    background: blue;
}
</style>
<div class="box">
    <div class="el1"></div>
    <div class="el2"></div>
</div>