CSS - 粘頁腳與多個div裏面頁腳不工作

我想實現一個粘腳頁腳，裏面有三個div頁腳的div。現在，如果我打開一個頁面，在這裏我把內容分塊空，頁腳不黏膩了:(我想知道我在做什麼錯CSS - 粘頁腳與多個div裏面頁腳不工作

CSS（代碼剝離，只顯示相關的CSS）：

/* Custom Sticky Footer */ 
.wrap { 
    min-height: 100%; 
    height: auto !important; 
    height: 100%; 
    margin: 0 auto -553px; /* Should be -553 px, but somehow doesnot work. This is a hack */ 
} 
.push, 
.footer { 
    height: 553px; 
} 

.footer{ 
    background-color: #fff; 
} 

#footer-margin-top{ 
    height: 20px; 
} 
#footer-top{ 
    background-color: #333333; 
    height:402px; 
} 
#footer-bottom{ 
    background-color: #232323; 
    height: 131px; 
    border-top: 1px solid #444444; 
}

和HTML（代碼剝離，只顯示相關的div）：

<!DOCTYPE html> 
<html lang="en"> 

    <head> 


    </head> 

    <body> 
    <div class="wrap"> 
    <div class="container"> 
    </div> 
    <div class="push"></div> 
    </div> 
    <div class="footer"> 
     <div id="footer-margin-top"></div> 
     <div id="footer-top"> 
      <div class="row-fluid"> 
       <div class="span12 social"> 
       </div> 
      </div> 
     </div> 
     <div id="footer-bottom"></div> 
    </div> 
</body> 
</html>

JSFiddle

來源

2013-05-28 joshi

你不使用jQuery嗎？你想讓頁腳菜單彈出點擊按鈕嗎？或者你總是希望頁腳高度相同？如果總是相同的高度，只需使用位置：固定底部：0爲您的頁腳 – bob

什麼是「內容塊？」我真的不能在jsfiddle中看到問題，所以我不認爲我理解 –

您是否試圖在http://twitter.github.io/bootstrap/examples/sticky-footer.html上獲得效果如果頁腳填滿屏幕，頁腳或者低於內容，或者頁面底部不足？ –