scrollbar-widthでスクロールバーを消す｜CSS

ブログのフッターに年度別の一件という画像付きのスクロールボックスのリンクを作成した。 スクロールボックスを作ると片端にスクロールの方向のスクロールバーが表示されていつもは隠された領域があることが分かるから便利だと思ってそののままにしていた。しかしながら今回のスクロールボックスはボタンを付けて隠された領域があることが分かるからスクロールバーはデザインの邪魔にしかならないと消したくなった。 スクロールボックスのスクロールバーを消す スクロールボックスのスクロールバーはサイトのデザインのCSSのマークアップで簡単に消すことができてスクロールバーの太さを指定できるscrollbar-widthを使うと良い。 scrollbar-widthのサンプルのソースコード HTML <div class="scroll-box”> スクロールボックスのコンテンツ </

[pinelike]

CSSのoverflow:scrollでスクロールボックスを作成するとスクロールバーが出ることがある。要らないときにはscrollbar-widthで消すことができる。2024年から対応ブラウザが増えたけれどもSafariが含まれないから修正が必要になる。