古いマシンの firefox 表示乱れ対策 - border-radius オフ

古いマシン (Pentium4Ubuntu Linux 12.04LTS) の firefox 30.0 で表示乱れを生じるウェブサイトが目立つようになりました。スクロール時にスクロール途中の位置に数回上書きが生じて、描画済みのテキストを塗りつぶしてしまい内容が読めなくなります。

ページに訪れた直後は表示乱れがなく一見すると正常に表示されていますが、スクロールしたとたんに乱れが発生します。ページの下端まで一度スクロールしてから、上へ逆スクロールしていくときは乱れません。表示乱れはハードウェア・アクセラレータのオン・オフに関係なく生じ、スマート・スクロールのオン・オフにも関係ありません。

表示乱れを生じるウェブ・ページに共通しているのは CSS3 の border-radius を多用していることです。困ったことに、github や多くのブログの pre 要素にスタイルが設定してあるため、私が訪れるサイトでは表示乱れが発生するウェブページの方が多いぐらいです。Wordpress を使っているブログと hatenablog は pre 要素に border-radius を設定しているため、確実に表示乱れが生じます。

とりあえず、border-radius をオフにすれば表示乱れが生じないことがわかったので、ユーザ・プロファイル・ディレクトリにある []chrome/userContent.css[] に次の一行を追加しました。

* { border-radius: 0px !important; }