页脚拒绝停留在底部

Question

学习 HTML 和 CSS 并想出了一些我不理解的东西。

有谁知道为什么我的页脚几乎显示在页面顶部。

这是我认为我做对了，

1) 在页面底部放置正确的页脚 HTML

2) 添加我的核心页脚 CSS，使其始终保持在底部并具有响应性

Codepen - https://codepen.io/nightcoder21/pen/BxwVdJ

我的html

  <footer>
    <div id="icons">
      <li class="list-inline-item"><a href="javascript:void();"><i class="fab fa-facebook"></i></a></li>
      <li class="list-inline-item"><a href="javascript:void();"><i class="fas fa-mobile-alt"></i></a></li>
      <li class="list-inline-item"><a href="javascript:void();"><i class="fas fa-envelope"></i></a></li>

    </div>
    <p class="text-center">yadayada</p>
  </footer>

除了从更有经验的人那里获得解决方案之外，如果有人能准确地告诉我哪里出了问题，我将不胜感激。

感谢您的阅读

干杯

Answer 1

将position: relative; 添加到您的body 标记中。

更新的 CodePen：https://codepen.io/anon/pen/deJwrw