0

我有一个固定位置的页脚，我试图将其保留在页面底部，但当我调整它的大小时，它也让它不跟随浏览器窗口。因此，如果我从底部拖动 Firefox，它就会被隐藏。

我尝试过相对位置，这使页脚跳起来并坐在页眉下方。我也尝试过绝对位置，我认为这是正确的使用，但它似乎与固定位置做同样的事情。

CSS：

html, body {
    height: 100%;
    width: 100%;
    overflow-x: hidden;
    margin: 0;
    padding: 0;
    font-family: Tahoma, Geneva, sans-serif;
    font-size: 12px; 
    -webkit-font-smoothing: antialiased; 
    font-smoothing: antialiased;
}               
#wrapper {
    min-height: 100%;
    position: relative;
}
#header {
    width: 100%;
    padding: 10px; 
    background-color: #fff;
    position: relative;
    -webkit-box-shadow: 0px 0px 30px #7a7a7a; 
    -moz-box-shadow: 0px 0px 30px #7a7a7a; 
    box-shadow: 0px 0px 30px #7a7a7a;
}
#content {
    padding: 10px;
    padding-bottom :45px;
}
#footer {
    width: 100%;
    height: 45px;
    position: absolute;
    bottom: 0;
    left: 0;
    background: #222;
    margin: 0;
    padding: 0;
}

有任何想法吗？

4

1 回答 1

0

我相信我已经解决了你的问题。您需要position: absolute;像以前一样使用，但不是从底部指定位置/位置，您必须像这样从顶部指定它：top: 500px;这样您就可以在页脚上方插入内容，并且即使您调整大小，它也会保持原位浏览器窗口！

编辑：经过一些研究，我发现另一种方法是将内容放在包含块中（这是一个定位为relative、absolute或fixed的元素），然后将其放在文档源的底部，并且从那里去。

于 2013-02-04T16:15:54.313 回答