Question

我正在使用二十个主题。

我不知道这是否重要，但为了让页脚一直伸出页面（100％），我把它放在包装div之外，所以不要：

<wrapper>
    <main>
    </main>
    <footer>
    </footer>
</wrapper>

我是这样说的：

<wrapper>
    <main>
    </main>
</wrapper>
    <footer>
    </footer>

页脚的CSS看起来像这样：

#footer {
    height: 100px;
    background:#393939;
    font-size:12px;
    color:#777;
    margin:0;
    padding:20px;
    z-index:999;
    bottom:0;
    clear:both;
}

页脚现在直接放在所有内容下，因此如果页面内容太短，则页脚不在页面底部，就像在此页面上一样： http://skiss.nu/hff/?page_id=10

如果我添加“position：absolute;”页脚停留在此页面的底部，但它覆盖了内容更多的内容页面。

Answer 1

您可以像这样在包装器div中添加最小高度：

wrapper {
    min-height: 600px;
}

在所有屏幕尺寸上看起来都不会很棒，但它可以快速完成工作。

Answer 2

您需要将您的职位定为“固定”。

#footer {
height: 100px;
background:#393939;
font-size:12px;
color:#777;
margin:0;
padding:20px;
z-index:999;
bottom:0;
clear:both;
position:fixed;
}

无法让页脚停留在页面底部

2 个答案: