Bootstrap5でFooterを下部に固定する
2022/11/30
<body>
<div class="container-fluid position-relative vh-100">
<div class="row">
色々ヘッダーとかコンテンツ
</div>
<div class="row position-absolute bottom-0 w-100">
<footer>
フッターの内容
</footer>
</div>
</body>参考にしたSEO汚染系量産型プログラミングスクールのサイトはこちら
よく見る手法だけどBootstrapで実装してるやつがパッと見なかったのでメモ
position-relativeとかまだ良く理解できてないかもしれない。
box-sizing: border-box;はBootstrapではデフォルトでグローバルに当たってる。
position-relative vh-100を付けないとスクロールしたときに重なってしまって✞CSS完全に理解した✞状態になる。