2012-01-19 20 views
5

Altbilginin her zaman en altta olmasını ve sayfa içerisindeki içeriğin boyutuna göre ayarlanmasını istiyorum. Şu anda altbilgiyi kapsayan dinamik bir içeriğim var, çünkü çok fazla içeriğe sahip.Css, sayfanın sonuna hizalanıyor

Nasıl

div#Footer 
    { 
     width: 100%; 
     height: 80px; 
     padding: 1px; 
     -moz-border-radius: 35px; 
     border-radius: 35px; 
     background-color: Black; 
     color: #ffffff; 
     position: fixed; 
     bottom: 0; 
     text-align: center; 
     margin-left: auto; 
     margin-right: auto; 
    } 
+0

olası yinelenen (http://stackoverflow.com/questions/3906065/css-sticky-footer) – Jakub

cevap

6

Bu sayısız kez sorulmuştur, bir Yapışkan Altbilgi arıyorsunuz.
Sadece bağlantıyı takip edin, bu iyi bilinen bir tekniktir ve tüm kaynak kodlarını burada sunarlar.

0

Burada ne olup bittiğini olumlu olması daha html/css mesaja gerek benim css düzeltebilirim ancak altbilgi içerik sayfada yer ediliyor gibi geliyor. Bu durumda, altbilgide bir z-dizini ayarlanması sorunu muhtemelen sıralayacaktır.

z-index: 1000; 

Bu

da tipik elemanları öncekilerin üstünde görünür daha sonra ilan gibi altbilgi, html'nizin sonunda görünen sağlayarak sıralanabilir.

+0

Ben uzun veya kısa olabilir Dinamik içeriğe sahip. Sayfa içeriği uzunluğuna ayarlamak için bu altbilgiye ihtiyacım var. z indeksi jsut kontrol katmanları değil mi? – CsharpBeginner

+0

O halde bir "sabit" altbilgi kullanamazsınız. Altbilginizi html'nizin sonuna koyun ve içeriğinizin sonunda yer alır. – mrtsherman

6

Ne istediğinizi biraz net değil ama bu kod benim için iyi çalıştı.

Kredi - http://css-tricks.com/snippets/css/fixed-footer/

#footer { 
position:fixed; 
    left:0px; 
    bottom:0px; 
    height:30px; 
    width:100%; 
    background:#999; 
} 

/* IE 6 */ 
* html #footer { 
    position:absolute; 
    top:expression((0-(footer.offsetHeight)+(document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight)+(ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop))+'px'); 
} 
1

Bu basit bir çözümdür. [CSS yapışkan altbilgi] arasında

#footer { 
    bottom: 0%; 
    position: fixed; 
} 
İlgili konular