剩余元素填充
问题： 有个容器，里面有上下两个元素。 上元素的高度固定(但未知)， 想让下元素充满余下的高度。
方法一
解决： 用 Flex
HTML:
I have a fixed height
I take up the remaining height
CSS:
#outer {
display: flex;
flex-flow: column;
height: 100%;
}
#inner_fixed {
height: 100px;
background-color: grey;
}
#inner_remaining {
background-color: #DDDDDD;
flex-grow : 1;
}
方法二
第一种绝对定位
第二种
box-sizing的两种方法
1. 方法一：
方法二：