CSSの100vwに垂直スクロールバーの幅が含まれる問題を解決するCSSで使用できる単位の vw (Viewport Width) をうまく使えてますか？ 親要素の横幅を基準にする % と異なり、vw はブラウザの表示領域を基準にするため、祖先要素の横幅に依存しない相対的な幅を設定することができます。 この vw にはブラウザの表示領域に表示されるスクロールバーの幅も含まれます。 スクロールバーの幅は、ブラウザによって異なるだけでなく、コンテンツの量や閲覧環境 (PC・タブレット・スマートフォン) によって、表示されたり表示されなかったりするので、vw は使いづらい印象があります。 今回は、スクロールバーの幅や表示・非表示の影響を受けずに 100vw を活用するためのテクニックを紹介します。 まず、前提として、一定の横幅で表示させたいコンテンツと、画面いっぱいに表示させたいコンテンツの2種類が混在し、それぞれをdiv要素などでラップするようなことはしたく
