​​CSS​Android,iOS,Playwright

Thumbnail of post image 174

スマホで height: 100vh のファーストビューや全画面メニューを開くと、アドレスバーの分だけ下が隠れることがあります。100svh・100dvh・100lvh の使い分けと、古いブラウザ向けの書き方をまとめました。

​​CSS​iOS,Playwright,Safari

Thumbnail of post image 178

​

iPhone のノッチなどで隠れる幅は、CSS の env(safe-area-inset-top) などで受け取れます。viewport-fit=cover を書き、固定したヘッダーや下のタブの padding に足す方法と、代替値 ...