Ayano Miyayama's Diary

宮山 彩野のホームページ(http://z45om201.starfree.jp/)付属の日記です。

表示乱れについて

先日コメントで「Internet Explorer 8(IE8)によるトップページの乱れ」を報告しましたが、改善できないことが判明しました。
該当箇所はトップページ左の項目が縦に並んでいるところです。
ここは表の左側1列だけ背景画像を使用し、立体的なボタンになっているように見せているつもりでした。しかしIE8ではこの背景がわずかに繰り返し表示され、結果的に枠内最下段に空白ができてしまいました。

改良すべくスタイルシートを弄ったのですが、FireFox3.6とIE8ではどうやらソースの読み込み方が違うようです。
画像は縦32px*横128px、これに対し枠のサイズを縦34px*横128pxとなるようにしています。こうすることでIE6とFireFoxでは枠の中にぴったり背景画像が入ります。
ところがこれだとIE8では上のような表示となりました。

肝心な原因ですが、表のセルを制御するtdタグの解釈によるもののようです。
FireFox及びIE6ではセルの高さを枠(border)の幅も含めた値と認識するため、1pxの枠線を上下合わせて1+32+1=34pxで良いわけです。
ところがIE8ではセルの高さにborderを含めないため、34pxを枠の内側のサイズと認識してしまうのです。これによりはみ出た2px分がわずかに繰り返されたものと考えられます。

対策としては画像を使わないという結論に至りました。従って次回の更新でこの背景画像は消すことにしました。

ちなみにIE6についてITmediaあんなことこんなことを記事にして載せています。
確かにセキュリティ面で不安はありますが、私は非常に使いやすいブラウザだと思って未だに使っております。カスタマイズの必要性の無さは特に軽量化に寄与しているように思えてなりません。
またWindows XPを使用している限りMicrosoft updataに接続する際に自動的に起動するので撲滅はほぼ不可能だと思います。

正直タブブラウザは一つ(FireFox)があれば良いのでこれからもIE6は使い続けるつもりです。