スポンサーリンク

【Tips】Windows版Chromeで縦スクロールバーが2重にダブって表示される場合の対処法

ITライフハック
この記事は約1分で読めます。
スポンサーリンク
当ページはプロモーションが含まれています

Mac を使っている人には気がつかないことが多いと思いますが(私も Mac ですので気がついていませんでした)、作成した Web ページを Windows 版の Google Chrome ブラウザで見ると縦スクロールバーが2重に表示されることがあります。
これの対処法をご紹介したいと思います。
縦スクロールバーが2重に表示される

Windows 版 Chrome で縦スクロールバーが2重に表示される
原因ははっきり分かりませんが、macOS 版の Chromeで は正常に表示されるのに、Windows 版 Chrome で見たときだけ縦スクロールバーが2本並んで表示され瑠事があります。

原因
原因は当該要素に

overflow-x: hidden;

が設定されているためです。

対処法
おそらくどこかの要素で width がはみ出ており、はみ出した要素を処理するために overflow-x: hidden; を設定したと思いますが、はみし出た要素を見つけて適切に設定し直し、 overflow-x: hidden; を削除しましょう。

まとめ
なぜ overflow-x: hidden; を付けた場合、Windows の Google Chrome でこの現象が起こるのかわかりません。
お役に立てれば幸いです。

タイトルとURLをコピーしました