読者です 読者をやめる 読者になる 読者になる

よしだです

プログラミングの勉強してます

footerを最下部へ設置する方法

空のページのようにコンテンツがない状態でもfooterを画面の一番下に設置する方法(fixedではなく)はないかなと思い調べました。

 

すると

html { 

 position: relative;

 min-height: 100%;

}

 

footer {

 position: absolute;

 bottom: 0;

}

 

とすると可能なようですね。

これにプラスしてページ全体にfooterと同じ高さのマージンをとると良いとのことです。

 

 

参考リンク

CSSだけで実装する!短めページの隙間なしフッタ – 株式会社AIコミュニケーション – 総合WEBプロモーション