CSS Push Div to bottom of page

İçeriği kaydırma çubukları için taşmaları, benim altbilgi her zaman orada olmak istiyorum . lütfen bu linkten bak, tam tersini istiyorum: ^strong>tamamlayınalt sayfa, Yığın Taşması gibi.

footer ve bu CSS kimliği ile bir div var:

#footer
{
position:absolute
bottom:30px;
width:100%;
}

Ama tüm görünüm penceresinin altına gidin ve eğer artık sonuna kadar aşağı kaydırma, hatta orada kalır.

Resim:

Açıklık değilse üzgünüm, tüm içeriğin gerçek altta olması için sabit, tek olmak istemiyorum.

Ne yazık ki fazladan bir ekleme HTML ve CSS bir parça başka bir güveniyor olması ile bunu yapamazsın.

HTML

İlk #holder Bir div içine, *header* 6 #body sarmalıyız:

<div id="holder">
    <header>.....</header>
    <div id="body">....</div>
    <footer>....</footer>
</div>

CSS

html body (gerçek vücut, #body dıv) height: 100% alt öğe üzerinde bir yüzdesi olarak minimum yüksekliği ayarlayabilirsiniz sağlamak için ayarlayın.

Şimdi ekranın içeriğini doldurur ve position: absolute #holder div altındaki altbilgi oturmak için kullanın #holder div min-height: 100% ayarlayın.

Ne yazık ki, footer aynı yüksekliğe olduğunu #body div padding-bottom uygulamak için footer herhangi bir içeriğin üzerinde oturmak yok emin olun:

html,body{
    height: 100%
}

#holder{
    min-height: 100%;
    position:relative;
}

#body{
    padding-bottom: 100px;    /* height of footer */
}

footer{
    height: 100px; 
    width:100%;
    position: absolute;
    left: 0;
    bottom: 0; 
}

Örnek çalışma, kısa gövde: http://jsfiddle.net/ELUGc/

Örnek çalışma, uzun gövde: http://jsfiddle.net/ELUGc/1/