我遇到了无法将版权页脚向下移动到页面底部的困境,目前由于某种原因,当我尝试检查 Google Chrome 中的元素时,它坚持位于我的页面中间它告诉我我的容器只有 471px 的高度(我屏幕的一半)....但我没有在我的代码中的任何地方限制我的高度,只有 100% 的最小高度所以我不知所措..任何帮助将不胜感激。谢谢:)
我会张贴图片,但我需要重复 10 次...才能做到...
这些是我的 CSS:
html, body{
height:100%;
}
body {
font-family: '', sans-serif;
font-size:16px;
color:#33767d;
text-align:left;
background-image:url();
background-repeat:no-repeat;
background-color:#FFF;
position:relative;
margin:0;
}
#container {
float:none;
margin:0px;
width: 85%;
margin-top:20px;
position:relative;
margin-bottom:0;
min-height:100%;
}
#footer {
position:absolute;
width:auto;
text-align:center;
font-size:8px;
color:#54c0cc;
font-family:'', sans-serif;
text-transform:uppercase;
top:100%;
left:40%;
height:60px;
}
和我的 HTML:
<body>
<div id="container">
--> Logo 和导航栏以及联系信息在这里
<div id="footer">
All Images © 2013 . All Rights Reserved.
</div> //div end footer
</div> //div end container
</body>
最佳答案
您可以使用javascript 将页脚保留在页面底部,只需计算窗口的高度和页脚的高度
我已经更新了代码,请使用它。
<script>
var windowheight = $(window).height();
var footerheight = $(footer).height();
var maincontentheight = windowheight-footerheight
$("#container").css({'height':maincontentheight +'px'});
</script>
关于html - 如何让容器 div 占满屏幕的 100%?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18527255/