エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
height100%のレイアウト覚書 - そこでひっかかる(masaakibの日記)
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
height100%のレイアウト覚書 - そこでひっかかる(masaakibの日記)
条件: コンテンツがブラウザウィンドウの高さからあふれる場合は、 footer要素がコンテンツの下につく... 条件: コンテンツがブラウザウィンドウの高さからあふれる場合は、 footer要素がコンテンツの下につく。 コンテンツがブラウザウィンドウの高さにおさまる場合は、 footer要素がウィンドウの下部につく。 html: body直下のタグの構造は以下のような感じ。 <div id="container"> <div id="conatiner_inner"> ... </div> </div> <div id="footer"> ... </div> css: html、bodyのheightは100%。 #containerにはmin-height:100%を指定。 #footerにheightを指定し(ピクセル指定)、 その分だけ#containerのmargin-topにネガティブマージンを指定する。 例えば、 #footerのheightが50pxなら、 #containerにma