トイレのうず

IE6にて縦スクロールバーが2本出てたのを修正

当記事はアフィリエイト広告を掲載しています。

「トイレのうず」本館の各コンテンツ内で縦スクロールバーが 2 本出ていた不具合をやっと修正。
IE6 以下では position: fixed; が効かないので、 div タグでページ全体をくくってそこにスクロールバーを表示させてたんだけれど、ウインドウの方のスクロールバーが残ってしまっていた。特にウインドウを小さくしたときに 2 重にスクロールバーが出るのはいただけない、と思いつつ何年も放置していた。
原因は IE が縦スクロールなしでもデフォルトでそれを表示する設定になっているから。要はそれを消せばいいわけだ。

IE で固定座標を指定する方法
↑このページを参考に
html {
overflow: hidden;
}

としてみるけれど、なぜかスクロールバーが消えない。試行錯誤の結果、
body {
overflow: hidden;
}

としてやっとスクロールバーを 1 本にすることができた。
参考にしたページのサンプルのスクロールバーはちゃんと 1 本だったから
html {
overflow: hidden;
}

が効かないわけないと思うんだけれど、なんでダメだったんだろう。

ちなみにわたしは IE にのみ対応させるためアンダーバーハックを使いましたが、 IE7 でちゃんと表示されているのだろうか? 環境がないから確かめようがない。

関連記事

【 CSS 】画像置換の方法を変更してみた
Web制作
thumbnail
iOS にて先頭の文字だけ文字化けして☒(□に×の文字)が重なる問題
Web制作
iOSにて先頭の文字だけ文字化けして☒(□に×の文字)が重なる
CSS 画像置換失敗
Web制作
thumbnail
Google Maps の情報ウィンドウの縦スクロールバーが邪魔!
Web制作
Google Maps情報ウィンドウに縦スクロールバーが表示される
サイト移転をクローラに知らせるために
Web制作
thumbnail
Google ウェブマスターツールにて「タイトルタグの重複」がたくさんある
WordPressWeb制作
thumbnail

コメント (2)

  • ds

    ありがとう助かった!!
    iframe について、最近だと解説記事がないから
    ほんとに助かった!

  • あさこん

    ◇ ds さん◇
    コメントありがとうございます。
    古い記事ですが、お役にたったようでなによりです。

コメントを書く