iOSのスマホでheight: 100vh;を定義してビューポートの高さいっぱいに表示したいのに、アドレスバーが表示されているとその分下が隠れて表示されてしまい、高さいっぱいにならないのを解決する方法を紹介します。 CSSのみのテクニックで、JavaScriptは必要ありません。 height: 100vh;だけでなく、min-heightやmax-heightでも機能します。 PostCSS 100vh Fix -GitHub PostCSS 100vh Fix 注意点 使い方 PostCSS 100vh Fix PostCSS 100vh Fixは、100vhのiOSの挙動（バグ？）を修正するPostCSSのプラグインです。ピュアCSSのソリューションで、JavaScriptは必要ありません。 高さいっぱいに表示したい時に、height: 100vh;だけを定義してもiOSでは期待通り
2014/09/25 この記事は書かれてから1年以上が経過しており、最新の情報とは異なる可能性があります techviewport これはさすがに書いておいた方がよいかと思ったので書いておきます。 結論だけ先に言うと、設定によって viewport の値が変わるので注意です。 設定によって viewport の値が変わる件2014年の9月に iPhone6, iPhone6 Plus がそれぞれ発売されたわけですが、 購入して初期設定してるときに気になる画面が。 へぇーー。初期設定の際に画面全体を標準サイズにするか、拡大サイズにするかを選択できるようになってました。 また、初期設定後であっても、設定 > 画面表示と明るさ > 画面表示の拡大 という項目で自由に変更できるようになっています。 プレビュー画面も用意されているので分かりやすいです。こちらが標準設定。 以下が拡大設定です。 比率は
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
