頁腳定位的問題

Question

這裏的問題是 FIDDLE DEMO

的樣品當你觀察窗口變小，從而使頁腳重疊的其他內容，並顯示滾動條。

當向下滾動頁腳時，它會卡在前一個位置並且不會回落。如果可能的話，我不想修復頁腳（position:fixed）。

難道這是固定的東西min/max-height財產或z-index？

HTML：

<header>something here</header> 
<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempora temporibus illum aliquam voluptatum at blanditiis itaque tenetur laborum officia culpa maiores quasi accusantium excepturi! Quidem alias ullam praesentium quod eius.</div> 
<footer>&copy; 2014 some text</footer> 

CSS：

header { 
    width: 100%; 
    height: 100px; 
    text-align: center; 
    color: #fff; 
    background-color: #333; 
} 
div { 
    height: 200px; 
    background-color: #ccc; 
} 
footer { 
    color: #fff; 
    background-color: #333; 
    height: auto; 
    width: 100%; 
    text-align: center; 
    bottom: 0px; 
    position: absolute; 
} 

Answer 1

這裏的問題是bottom:0！

我希望這是你想要的 - >Fiddle Demo

我加height:100%希望，那就是你想要的。

你可以改變它，如果你想

html,body{ 
    width:100%; 
    height:100%; 
} 
header { 
    width: 100%; 
    height: 100px; 
    text-align: center; 
    color: #fff; 
    background-color: #333; 
} 
div { 
    height: 100%; 
    background-color: #ccc; 
} 
footer { 
    color: #fff; 
    background-color: #333; 
    height: auto; 
    width: 100%; 
    text-align: center; 
    position: absolute; 
}