Firefoxで常にページのスクロールバーを表示させる方法

ページがスクロールしなくても表示できる場合、Firefoxではスクロールバーが出ません。
テンプレートを固定センター寄せにすると、センターの位置がずれる現象が起きます。
気になる人には気になるみたいです。
私のサイトでもそうですが、テンプレートを固定でセンターに寄せると、スクロールバーが出る、出ないで、センターの位置が変わってしまいます。
それによって、ページを切り替えていると、テンプレート全体が数ミリ左右にずれて見えてしまいます。
私はそんなに(というか全く)気にならなかったのですが、気になる人には気になるみたいで・・・

それを防ぐには、「常にスクロールバーを表示する」ということが有効です。
IEはデフォルトで、常にスクロールバーが表示されていますが、Firefoxは、スクロールしなくても全体が見えるページはスクロールが表示されません。

方法ですが、CSS(スタイルシート)を利用します。
外部スタイルシートに以下のソースを追加します。

html{overflow-y:scroll;}

htmlに記述するのがポイントです。
一般的にはbodyに追加すると思うのですが、それではIEで二重にスクロールバーが出てしまいます。(これはバグ?)

同様にWindows版OperaとNNにも適用されるのか?と思いましたがだめでした。
誰か、OperaとNNでも「常にスクロールバーを表示する」方法を知っている方がいらっしゃいましたら、教えてください。

余談ですが、Operaにはブラウザの設定で「常にスクロールバーを表示しない」ということができます。
これでは、ページのどのくらいの位置を読んでいるのかわからなくなってあまり意味ないと思いますが、どうなのでしょうか?(ホイールがないマウスを使用していたら、スクロールもできないよ!!)


2006/08/23 追記
なぜ、html{overflow-y:scroll;}がFirefoxにしか対応できなかったのか、謎が解けました。
そもそも、htmlやbodyにoverflow-yあるいはoverflow-xを使用できるのは、IE独特のプロパティだったらしいです。
そしてCSS3からoverflow-yあるいはoverflow-xが適用されるようになったとの事。
今のところ、FirefoxがCSS3に対応しているので、Firefoxのみがきちんと表示されたと言うことでしょうか。
間違ってたらすみません。
あれ?でもOperaってCSS3に対応してたような・・・

だれか正しい解答を教えて~


2007/02/22 追記
Windows /IE6、Firefox2、Opera9.1、NN7.1全てでスクロールバーが出る方法がわかりました。(動作確認済み)
正確に言えば、IE6はスクロールバー領域が表示されます。他のはスクロールバーも出現します。
html{
height:100%;
margin-bottom:1px;
}
とCSSに記述すればよいとのこと。
このソースを見たらどういうことかすぐ分かると思いますが、画面いっぱいのサイズが100%、それに1pxを足すことで、コンテンツ量が画面からあふれるため、スクロールバーが出るってことですね。
うむむ、よく考えたら思いつきそうなことなのに、思いつかなかった私って・・・

このソースはEmotional Webさんのサイトで知りました。
スクロールバーの有無によるセンタリングのずれを解消するには | Emotional Web
投稿日:2006年8月 9日

トラックバック歓迎です。以下URLにて登録をお願いいたします。

このエントリーのトラックバックURL:

↓↓↓トラックバックしてくださった方々↓↓↓
※トラックバックされても管理人がスパムと判断したものは公開されません。

top