我正在为响应式网站工作并使用Twitter bootstrap。我无法在我的网站中修改页脚。谷歌搜索了许多网站找到的解决方案,但它不适用于我的特定页面。无法追踪问题。请查看code here jsdiddle.。我不希望页脚下方有任何空间。谢谢。
//css
html, body {
height: 100%;
margin: 0pt;
}
#wrap {
min-height: 100%;
height: auto;
margin: 0 auto -60px;
padding: 0 0 60px;
}
#footer {
height: 60px;
background-color: #f5f5f5;
}
答案 0 :(得分:2)
您的HTML结构不正确。
页脚div必须在包裹之外
<强> HTML 强>
<div id="wrap">
<div class="container-fluid" style="padding-top:1%; padding-bottom: 1%;">
<div class="row-fluid">
<div class="span12 largecircle">
</div>
</div>
</div>
</div>
<div id="footer">
<div class="container-fluid" style=" background-color:#cccccc; position: absolute; opacity:0.7;">
<div class="row-fluid">
<h1>Sticky </h1>
</div>
<p class="lead">Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS.</p>
<p>Use if need be, too.</p>
</div>
</div>
答案 1 :(得分:0)
也许这可以解决您的问题:
#wrap {
min-height: 100%;
height: auto;
margin: 0 auto;
padding: 0;
}
答案 2 :(得分:0)
那个空间就在那里,因为你有-60px边距
margin: 0 auto -60px;
答案 3 :(得分:0)
这就是您要找的内容:http://ryanfait.com/html5-sticky-footer/