技術メモのかけら

内容はもとより調べたことすら忘れてしまうので個人的な技術メモを残しているブログです。Qiitaの記事にするほどでもない細かいネタを投稿します。

IE9でoverflow:autoしたボックス内のテーブルでhoverするとレイアウトが崩れる

テーブルにhoverするとテーブルの下にある要素がどんどん下に下がっていく変なバグがあった。
IE7、8、10、11は大丈夫なのになぜかIE9だけで起きる。

結果的にはIE9のバグっぽい。
問題のテーブルは横長になるので、overflow-x:auto;にしたdivで括っているのだが、tableにhoverを仕込んでいると発生するようだ。

overflow-x:scroll;にしたら問題の現象は起きなくなったけど、レコード0件のときに必要ないスクロールバーが出るようになっちゃった。
0件のときにはdivを非表示にするとか、そもそもhoverするのを止めるかどうしようかな。
IEがちゃんとバグを直してくれると良いのですが。

参考

http://128bit.blog41.fc2.com/blog-entry-307.html