Question

当我有一些工作得很好的内容时。如果我只是放了一堆像它一样的东西也可以。如果我从#content中删除内容，它也会起作用。由于代码太多，我会在pastebin上粘贴。在此屏幕截图中显示的问题是： http://postimage.org/image/ee448x5yp/ 页脚是黑色部分，绿色部分是html，正如你在css上看到的那样。任何可能的解决方：（

HTML

<div id="wrap">
    <div id="header">
        ...
    </div>
    <div id="content">
        <div class="center">
                ...
        </div>
    </div>
    <div id="footer">
        ...
    </div>
  </div>

CSS

#wrap {
    width: 100%;
    min-height: 100%;
    margin: 0 auto -75px; /* the bottom margin is the negative value of the footer's   height */
    position: relative;
    text-align: left;
}

#footer {
  position: absolute;
  bottom: 0;
  height: 75px; /* Height of the footer */
  width: 100%;
  background: #000;
  text-align: center;
  line-height: 103px;
}

整体情况

http://jsfiddle.net/Vmvrd/

Answer 1

我认为它工作正常，看一下我添加到你编辑过的帖子中的小提琴示例。

Answer 2

页脚中的元素比它高。它们会扩展body，但不会扩展页脚，因为页脚的高度是固定的。将overflow: hidden添加到#footer，然后从那里开始工作。

页脚不会留在底部的内容

2 个答案: