我的粘性页脚不工作 [英] My sticky footer doesn't work
问题描述
我知道这个问题已被问过很多次，但我还没有找到一个对我有效的解决方案。
I know that this question has been asked many many times, but I haven't found a solution that actually works for me.
我的html ...
My html...
<body>
<div id="container">
</div>
<div id="footer">
</div>
</body>
我的css ....
My css....
body, html { min-height:100%;}
#container
width: 980px;
min-height: 100%;
margin: 0 auto;}
footer {
background-color: rgb(90,200,219);
height: 50px;
position: realative;
margin-top: -50px;
width: 100%; }
发生了什么，是页脚完全粘在页面底部。但是，当内容很短时，我仍然需要向下滚动才能找到粘在底部的页脚。有人可以告诉我代码中有什么问题吗？
What is happening, is that the footer is totally sticking to the bottom of the page. But, when content is short, I still have to scroll down to find the footer which is sticking to the bottom. Can someone tell me what is wrong in my code?
推荐答案
我认为您应该修复您的CSS代码段，数量错了它。使用复制&
I think you should fix up your CSS snippet as it has quite a number of things wrong with it. Use copy & paste to put it up here next time so your typo's don't throw anyone off.
body, html { min-height:100%; }
这应该是 height：100％; ，但我认为这可能是一个错字，因为你说的脚注坚持到底部，如果这一行真的在你的实际CSS，不会。
That should be height:100%;, but I think it might be a typo as you are saying that the footer sticks to the bottom, which it wouldn't if that line was really in your actual CSS.
#container 缺少括号，应为 #container {。
如果这些问题是固定的，除了@Owlvark已经指出的问题。在 jsFiddle 这里似乎很好用。我可以想到的唯一的改进是添加 margin：0px; 到 body，html ，这可能是你的问题因为它摆脱了一些额外的空间，将渲染一个垂直的滚动条。但你的问题似乎比你说你必须向下滚动找到页脚更严重。
If those issues are fixed, in addition to the issues @Owlvark has pointed out. It seems to work fine here at jsFiddle. The only improvement I could think of was adding margin: 0px; to body, html, which might have been your issue as it gets rid of some extra space which would render a vertical scroll bar. But your issue seems more serious than that when you say you have to "scroll down to find the footer".
这篇关于我的粘性页脚不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
