CSSで100vh高さ指定してもはみ出るときの解決方法 - JINMUSOFTWARE100vhだとはみ出してしまう 画面高さピッタリの指定で、100vh、100%が使えるかなと気軽挑戦したら直ぐには出来なかったので覚書として残します。 とくにiPhone上のブラウザの挙動がそうなってしまうようです。Safariで表示した時の、上段のURL表示領域か下段のブラウザ操作領域の高さが考慮されていないのが原因かなと推測。 要件 一画面のレイアウトがheader、main、footerで構成されるとして、 mainのコンテンツが少ない時は、mainエリアが上下一杯に伸びて、footerが下段に配置される。この結果、ちょうどぴったりな感じにしたい。 mainのコンテンツが増えてた場合は、親要素の高さが追従する。スクロールバーが必要になるでしょう。 内容物が少ない時に高さ100%を使用したいものです。最初から内容物が多い時は意識しないレイアウトですね。 結論 100svhを使用すればい
JINMUSOFTWARE
