[CSS]スマホで要素を高さいっぱいに表示したいのに、期待通りに表示されない時の解決方法
ビューポートを使った単位（vw, vhなど）は、特にスマホの各ブラウザにおいて複雑です。例えば、vwのスクロールバーを考慮する必要がありますか？ サイトのナビゲーションやページコントロールはどうでしょうか？ それらは計算に含まれますか？ スマホで要素をビューポートの高さいっぱいに表示したいのに、期待通りに表示されない時の解決方法を紹介します。 The trick to viewport units on mobile 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 ビューポートの高さ（vh）の仕様 高さいっぱいの要素を表示する方法 ビューポートのリサイズにも対応する ビューポートの高さ（vh）の仕様 W3Cの仕様では、ビューポートの単位をどのように計算するかは漠然としています。スマホでは高さが重要になることが多いので、ビューポー
![[CSS]スマホで要素を高さいっぱいに表示したいのに、期待通りに表示されない時の解決方法](https://cdn-ak-scissors.b.st-hatena.com/image/square/8a5cf0a3bb9540d4d9f77cfb193ce39e28e90836/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201803%2F2018080401-02.png)
スマホデザインの参考に！アプリやスマートフォンサイトのギャラリーサイトまとめ | creive
※この記事は、2013年2月05日に公開された記事を再編集したものです。 こんにちは。creive編集部です。 今回は、スマートフォンサイトやアプリをデザインするときに参考にしたい、ギャラリーサイトを紹介します。 iPhoneデザインボックス 国内のスマートフォンサイトが中心のデザインギャラリーサイト。 このサイトの特徴は、スマホ表示とPC表示の画面がそれぞれ紹介されているので比較することができることです。 それぞれでどのように表示を出し分けているかも一目瞭然！ http://design.web-hon.com/ sps collection 国内、海外問わず紹介されています。 ジャンルごとや色などから細かく検索できるので、探したいイメージのサイトを見つけやすいです。 会員登録なしでブックマークしておけるのも気軽で便利です。 https://spscollection.com/ Resp
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
