DIV 100% 自適應高度 不出現滾動條

這也是忽然發現的。爲何 在html中設置 padding-top:100就有效果呢？但願有人給於解答。

 

如下是代碼

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html xmlns ="http://www.w3.org/1999/xhtml" >
< head >
   < title >Qhis 2008 </title>
     < style type ="text/css" >
    * {
    padding: 0px;
    margin: 0px;
}
html,body{
    background:#FFFFFF;
    height: 100%;
    width: 100%;
}
html{
    padding-top: 77px;
}
#E1{
    position: absolute;
    width: 100%;
    height: 57px;
    background: Aqua;
    z-index: 1;
    top: 0px;
}
#E2{
    position: absolute;
    width: 100%;
    height: 20px;
    background: Blue;
    z-index: 1;
    top: 57px;
}
#E3{
    width: 100%;
    height:100%;
    background: #ff0;
}
     </style>
</head>
< body >
     < div id ="E1" > </div>
     < div id ="E2" > </div>
     < div id ="E3" >sddsfsdff </div>
</body>
</html>