Why doesn't CSS set min-height to body?

When the content area of the Web page is very small, footer will run to the top?
I set min-height:100% for body,html;
Set height:100%; it's okay, but it's a little more than a screen.

body,html{   min-height:100%;} body{   position:relative;}. content{  podding-bottom:100px;}. footer{position:absolute;bottom:0;left:0;height:100px;}

Write this:

HTML {    height:100%;} body {    position:relative;    min-height:100%;    Box-sizing:border-box;     padding-bottom:80px; /* Footer height, footer placeholder */}. footer {     position:absolute;     bottom:0;     left:0;     width:100%;     height:80px;}

The above code is compatible to IE8 and above

I've had problems like this, and that's how I solve them:

html,body,.content{    min-height:100%;} html{    -ms-text-size-adjust:100%;    -webkit-text-size-adjust:100%;} body{    background: #eeeeee;}

Then use the JS control to get $ (". Content"). Height ($ ("html"). height); I feel this adjustment is a bit more reliable.

100% is based on his father's elements to do the comparison, for example,

<div style= "width:100px;" >    <div style = "width:50%;" ></div></div>

Back to the landlord problem, so HTML can only set a fixed height, set the body height percentage, then you set the height of the HTML element!