IEでiframeを使ってページを読み込ませたときに、iframeの中に読み込まれたページの縦の長さがiframeの縦の長さをオーバーすると、縦スクロールバーだけでなく横スクロールバーも表示されてしまいます。
横はオーバーしていないにもかかわらずです。
同じページをFirefoxでみると、横スクロールバーは表示されません。
縦横どちらがオーバーしているのかを判断して自動的に、縦か横のどちらかのスクロールバーだけを出すということがIEにはできないのか?
と思ったりするんですが、逆の場合は大丈夫なんですよね。
横がオーバーして縦はオーバーしてない場合。
これは横スクロールバーだけが表示されます。
やっぱりIEって……
で、調べてみたら解決法はありました。
解決法はけっこう簡単で、iframeの中に読み込まれるページの「html」タグに「overflow-x:hidden」を設定するだけでOKです。
つまり……
html {
overflow-x: hidden;
}
こういうこと。
簡単ですね。
やってみたらちゃんと横スクロールバーが消えてくれて、ちょっと感動してしまいました。