我首先要说,我只是发布这个,因为在这个网站上的任何回应对这个话题都没有帮助,因为我给出的解决方案已经尝试过,但它们没有奏效。(如果我错过了一个,我道歉(
链接: nova.it.rit.edu/~whateverokay/index.php
我试过:
使包装器位置相对于并在底部添加任何填充都无济于事。使页脚位置绝对化,无济于事。它只到屏幕底部而不是内容。因此涵盖了一堆内容。
我读过这些:
-
matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page
-
wordpress.org/support/topic/fixed-footer-covering-content
-
webdeveloper.com/forum/showthread.php?202513-Position-footer-at-bottom-regardless-of-content-height
-
本网站上与此相关的任何问题。
-
还有一些我不记得了,是的,甚至是一些网站链接到的粘性页脚(cssstickyfooter.com/(
基本结构:
<div id="mainHead">
other divs to hold header
</div>
<div id="wrapper">
<div id="content">
content here
</div>
</div>
<div id="footer">
<footer>
content here
</footer>
</div>
.CSS:
#wrapper{
position:relative;
min-height:100%;
height:100%;
padding-bottom:0px 0px 100px;
}
#content{
width:60%;
position:relative;
padding:10px;
}
#content, footer{
margin-left:auto;
margin-right:auto;
}
#footer{
font-size:9pt;
font-style:italic;
text-align:center;
overflow:auto;
height:100px;
position:absolute;
bottom:0px;
width:100%;
margin-top:50px;
border-top:4px solid #35475f;
background-color:#35475f;
clear:both;
}
footer{
width:60%;
}
是的,其中一些可能是不必要的,但我一直在尝试一切。我不能使用什么:JQUERY查询固定位置也不起作用,因为它涵盖了内容。此外,它只需要在内容的末尾。
这是一个学校项目。我有我的限制。必须与 IE8 兼容。Javascript是可以的,如果有人知道解决方案的话。
在顶部创建另一个名为"容器"的 DIV,然后将页脚 DIV 添加到其末尾
<div id="container">
<div id="mainHead">
other divs to hold header
</div>
<div id="wrapper">
<div id="content">
content here
</div>
</div>
<div id="footer">
<footer>
content here
</footer>
</div>
</div>
哦,是的,并摆脱所有CSS垃圾(几乎所有内容(