html - 如何删除 HTML5 中粘性页脚下方的空间?

标签 html css twitter-bootstrap

我正在为响应式网站工作并使用 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;
}

enter image description here

最佳答案

您的 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>

JSFiddle Demo

关于html - 如何删除 HTML5 中粘性页脚下方的空间?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21046515/

相关文章:

javascript - 改变图像src jquery动画

html - 文件 .scss 未在构建中生成

javascript - float 和淡入淡出的文本?

html - Bootstrap Grid - 具有相同水平/垂直间隙的方形瓷砖

javascript - 使用 Jasmine 在 Angular 中模拟 Modal 实例

javascript - 如何在不向服务器发送数据的情况下显示选定的图像?

html - HTML 中的条纹表

html - 如何让搜索栏变大?

jquery - 如何在 Bootstrap 4 中悬停时激活导航下拉菜单?

css - 如何在 Twitter Bootstrap 上将框居中