0

我的网站有一个包装器,目前正在第一次用 HTML5 编写一个功能齐全的网站,并且在让我的页脚“粘”到包装器底部时遇到问题。

当我摆弄 CSS 时,有时我会成功地让页脚粘在包装器的底部,但是如果包装器的内容(文章/部分)超过浏览器的折叠,那么包装器中的内容会破坏包装器edge 作为包装器的高度似乎只是屏幕分辨率的高度(在这种情况下为 768)。所以内容最终会出现在页脚后面。

无论如何代码:

     <footer>

    <p><small>&copy; Copyright blahdeblah 2013. All Rights Reserved.</small></p>

    </footer>

CSS:

html,body{
height:100%;
}

   #wrapper {
height:100%;
margin:0px auto;
position:relative;
width:900px;
}

footer{
background:#B4B4B4;
border:5px solid #FFFFFF;
height:50px;
line-height:45px;
position:absolute;
bottom:0px;
text-align:center;
width:100%;
}

所以基本上我的包装没有随着内容扩展:(

4

1 回答 1

0

如您所见,包装器的高度设置为 100%。这意味着包装器的高度不会超过用户屏幕的高度,即使其中的内容可能。删除 'height:100%' 部分应该可以解决您的问题。如果用户的屏幕比包装器中的内容短,则会出现一个滚动条。

于 2013-09-25T09:16:39.333 回答