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上获得效果如果页脚填满屏幕，页脚或者低于内容，或者页面底部不足？ –