This article was also published in HTTPS://GITHUB.COM/ZHANGYACHEN/ZHANGYACHEN.GITHUB.IO/ISSUES/38
The browser does not calculate the height of the content at all, unless the content is outside the window (causing the scroll bar to appear). Or you set an absolute height for the entire page. Otherwise, the browser will simply let the content piled down, the height of the page is not considered at all.
Because the page does not have a default height value, when you set the height of an element to a percentage height, you cannot calculate its height based on the height of the parent element. In other words, the height of the parent element is just a default value: Height:auto;. When you ask the browser to calculate a percentage height based on such a default value, you can only get undefined results. is a null value, the browser does not react to this value.
WORKAROUND: Set a valid value for the parent element to a height
Reference: Http://www.webhek.com/css-100-percent-height
Invalid CSS height:100%