推粘页脚后，包装器上方的空白块
Posted
技术标签:
【中文标题】推粘页脚后，包装器上方的空白块【英文标题】：Blank block above wrapper after push sticky footer 【发布时间】：2014-09-13 23:08:05 【问题描述】：我终于得到了一个与 push div 配合使用的粘性页脚。不幸的是，我的包装器上方现在出现了一个奇怪的块。我当然想摆脱这个。
相关网站： http://print503.squarespace.com/gallery/
基本 html 结构：
<body>
<div id = "wrapper">
[all content divs (dynamic/responsive)]
<div class = "push">
</div>
</div>
<div id = "footer">
</div>
</body>
基本 CSS 结构：
html, body
height: 100%;
padding: 0;
margin: 0;
#wrapper
position: relative;
margin: 0;
padding: 0;
min-height: 100%;
z-index: 1;
.push
opacity: 0;
height: 50px;
bottom: 0;
#footer
background-color: #000;
height: 200px;
bottom: 0;
所以我用我自己的 HTML 和 CSS 覆盖了这个 squarespace 网站的模板。我认为包装器（名为“#outerWrapper”）是背景图像。我不知道这是否是导致现在出现的顶部块出现问题的原因。
我已经进行了数小时的研究，但无法弄清楚这个问题。希望得到一些帮助。提前致谢。
【问题讨论】：
【参考方案1】：添加
#outerWrapper
display: inline-block;
似乎可以解决它，如果这就是你想要的（摆脱顶部的黑条并让背景图像一直显示到顶部）。
【讨论】：
谢谢你一百万次！做到了！还在学习。再次感谢。以上是关于推粘页脚后，包装器上方的空白块的主要内容，如果未能解决你的问题，请参考以下文章
HTML Zen编码HTML全页：包含UL导航+内容+页脚的包装器DIV
使用 Ghostscript.NET 包装器打印 PDF - 空白页