页脚不起作用 - 不会转到页面底部 [重复]

Question

我希望有人会帮助我。 这听起来很荒谬，但我试图解决这个问题 2-3 天...... 我希望我的页脚位于页面底部。 如果内容很少，我希望页脚位于屏幕底部，但如果内容很多，我希望页脚位于页面底部。

我尝试了很多组合，但没有任何效果...... margin-top，浮动内容和清除：两者；页脚...只是没有效果。 页脚位于屏幕底部，因为我设置了底部：0px；但是当我向下滚动时，页脚向上...我不知道为什么...

这是我的代码...你可以看到所有这些。

`https://jsfiddle.net/nemanja917/bxy9m29g/`

我希望有人知道问题出在哪里。

谢谢。

附：我需要 PURE CSS 解决方案

编辑... 您将此问题标记为重复...是的.. 是的，但没有正确答案，所以我再次打开此问题尝试找到一个。

而且我需要页面底部的页脚，而不是屏幕。 所以我不能使用 position: fixed;

Answer 1

你把底部：0px;而是尝试

 .footer {
    position: absolute;
    width: 80%;
    bottom: 0;
    background-color: darkblue;
    color: white;
    font-size: 20px;
    padding: 10px 0px;
    text-align: center;
    clear: both;
}

Answer 2

你可以试试这个：

.footer {
  position: fixed;
  height: 100px;
  width: 100%;
  bottom: 0;
}