今日、MicrosoftよりInternet Explorer 7の日本語正式版がリリースされました。
ぼくもWindows Vistaのベータ版をインストールしたときにIE7もベータ版として使ったことがあったのですがなぜかこのブログだけがうまく表示されず「まあまだベータ版だから」と思っていました。IE6ではちゃんと表示されてたんですけどね。HDDがギリギリでVista自体が少々重かったのもありOSはすぐにXPに戻しました。
そして今日、早速IE7の正式版をインストールしてみたらなんとまたうまく表示されていません。同じタブブラウズを搭載Netscape7.1も同じような症状が出てしまいました。
どうやらこのブログが悪いようです。(Netscapeで確認するまでもない)
症状は
・メニューのリンク文字の色・配置がバグってる
・カテゴリ一覧の上になにやらへんな文字？が
・四国一周についての案内だけが色と大きさが違う
・フッターが背景からはみ出ている

そこで一番ダントツにアクセス数が多いIE6でもちゃんと表示され、IE7にも対応できるようがんばって修正してみました。
難しくなかった順に

・メニューのリンク文字の色・配置がバグってる
⇒背景をいじるのは面倒になりそうなので人気ブログランキングの表示を取り払ってうまく背景あわせました。

・カテゴリ一覧の上になにやらへんな文字？が
⇒これはブログ説明をh2タグでくくっているものです。見えないように文字色を背景と同じ色にしているので見た目には出てこないはずなのですが…。CSSで矯正しているのでCSSを確認してみるとカラーコードの＃が抜けていました(笑)IE7はずいぶんチェックが厳しいんですね。ちゃんと＃をつけるときっちり隠れてくれました。でも空白が気になるので画像にaltで埋め込んでをh2タグでくくって左右のサイドバーとも同じ高さにそろえました。

・四国一周についての案内だけが色と大きさが違う
⇒ここの部分だけtableを使っていてそれがIE7は気に食わないようです。ということでfontでサイズと色を指定してチャンチャン。っと思ったらよく見ると文字がセンターに寄ってる。そういえばメニューバーの文字もtableでくくっていてしかも文字がセル内でセンターに寄ってるので何か関連性があるのかも。ということで次へ。

・メニューのリンク文字の色・配置がバグってる
⇒リンク文字の色はCSSで指定しているのでCSSを確認してみたのですがさっきのバカみたいな間違いはなく問題はなさそうでした。ただ、この部分はClassでメニューバーだけに働くように指定しているのでもしかしてそれがうまく働いていないんじゃないかと。案の定class名はなんとも簡単な「1」、試しにclass名をmenu1としてみると…見事に直りました。なんだよ、さっきはあんだけチェック厳しかったくせに。
そして文字が中央に寄ってしまうのはかなりの難敵でした。いろいろ試行錯誤して原因を突き止めました。それはページ全体にかかるcenterタグ。bodyのすぐ後にあるのでこのブログはこれで中央に寄せている。これを取ったら左によってしまうはず…だったのですがメニューバーが1pxほど左に寄っただけ。メニューバーにalign="center"を入れると完璧！！よっしゃこれでIE7に完全対応や！しかしそんなにうまくいきません。IE6でちゃんと表示されないのです。やはりcenterタグを失ったためaliginで寄せたメニューバー以外は全部左に寄ってしまいました。そこからは何もかもがうまくいかずヘッダーをcenterタグで、メニューバーをalignで、それより下をcenterでとかいろいろやってみたのですがIE6ではダメ。

ということで今回は一部がセンターによってしまうのは妥協してとりあえずプレ対応ということにしました。



IE7はタブが使えてとても使いやすく今はまだまだユーザーは少ないですが後々絶対増えてくるので(花が咲くとついついタスクバーのIEの数字が2ケタになってしまいますから)近いうちに何とかしたいと思います。IE7ユーザーの方はできればタブの設定でポップアップ発生時は「ポップアップを開く時はinternet Explorerで自動的に判別する」にしてください。画像はポップアップで表示されるので。

ちなみにNetscape7.1ではWhat's newが拡大表示される以外は完璧です。これもついでに何とかしたいと思います。

---

←よろしくお願いします！
ランキングアップを応援していただける方はクリックをよろしくお願いします。