css - 带有 CSS 粘性页脚的重叠 block + 960 网格布局

标签 css sticky-footer 960.gs

我下载了CSS sticky footer960 grid system代码。

粘性页脚按预期工作 - 如果内容 Pane 为空,页脚会粘在视口(viewport)底部,当页脚已满时会向下推。

我在 960 网格系统中使用 css 粘性页脚代码,但是当侧边栏内的内容展开并到达页脚时,页脚与侧边栏内容的末尾重叠:

http://noseyparka.me.uk/sandbox/

知道我哪里出错了以及如何解决这个问题吗?

最佳答案

您滥用了 StickyFooter,您的包装器缺少额外级别的定义,以防止正文内容与页脚重叠。

要解决它,请将 main id 添加到 body-content 级别(在我们的例子中是 960gs 容器)以容纳:

<div id="wrap">
    <div class="container_12" id="main">
        <!-- ... -->
    </div>
</div>

引用:

关于css - 带有 CSS 粘性页脚的重叠 block + 960 网格布局,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10726413/

相关文章:

html - 如何定位选中的单选按钮 (CSS)

html - 粘性页脚冲突 css

css - 带有固定标题元素和透明度的 ie7 中的 z-index 问题

html - Freemarker/NetSuite 绝对定位

html - 用阴影堆叠两个边框?

javascript - 使用 CSS/Javascript trim 图像空白?

twitter-bootstrap - 如何删除 Bootstrap 3 类行底部白色边框

内列中的 CSS 100% 高度

html - 交错网格系统

html - 960gs和骨架的实用性