页脚定位的问题

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; 
}