height:100%;和height：inherit的異同
1、兼容性差異
height:100%; ie6+
height:inherit; ie8+
2、除去兼容性，大多數height：100%與height:inherit都表現為height:auto;
3、絕對定位卻不同，當子元素的高度大於父元素的高度時，height:inherit 比 height：auto；好用多了
height:inherit;會讓子元素限制在父容器內，而加上height：auto；的屬性的子元素會超出父元素的
height:100%;與min-height的用法
1、當子容器的高度超過父容器的時候，父容器會被子容器撐開
解決辦法1、height：inherit；
解決辦法2、給子元素加上min-height:0;
我最近做了一個項目就是子元素的高度大於父容器，結果把父容器撐開了，先說說我的頁面大致結構
html:
<body>
<header></header>
<section></section>
<footer></footer>
</body>
css:
body{
width:100%;
height:100%;
display:flex;
display:-webkit-flex;
}
header{
width:100%;
height:100px;
}
section{
width:100%;
min-height:0;
flex:1;
-webkit-flex:1;
overflow：hidden；
}
footer{
width:100%;
height:100px;
}
以上是我一個移動端項目，用了min-height:0;很好的解決了子元素超出父容器的情況
ps：當時試用了height：inherit；也是可以的、、、