Html 页脚拒绝贴到底部

在学习HTML和CSS时，我发现了一些我不理解的东西

有人知道为什么我的页脚几乎出现在页面顶部吗

这是我认为我做得对的事情

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

2添加我的核心页脚CSS，使其始终位于底部，并具有响应性

代码笔-

我的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>

除了从经验丰富的人那里得到解决方案外，如果有人能准确地告诉我哪里出了问题，我将不胜感激，这样我就可以学习了

谢谢你的阅读

干杯

添加位置：相对；到你的身体标签

---

更新的代码笔：

将绝对值替换为页脚以修复您知道为什么FB社交图标没有与其他图标对齐吗？。。thanks@Ravi21你有垫底：2.3rem；在css中的.fab类上执行两次。查看此更新