ブログデザインのリニューアル作業を漸く終えました

kindmoon_diary2012-04-04

ヘッダー画像は、Gエモの写真集からロゴを、GエモのDVDからシルエットを用いて作成しました。シルエットの方は、文字消し作業があったので無駄に時間を割くことになった。ブログ全体のレイアウトも変え、水色を基調としたデザインに一新。cssの記述には大して明るくない私が、試行錯誤を繰り返し漸く辿り着いたこのデザイン。結構気に入っています。ですが、最終的な仕上げとして複数のブラウザで動作確認していたら、事件発生。なんとIEでこのブログを見ようとすると大幅にデザインが崩れる。そこで、その原因を調べるためググっていたら、意外と近いところでこんな記述を発見。

bodyにmarginが効かないブラウザがあります(IE)。なのでbodyではなく、table、h1、div.hatena-bodyにそれぞれ指定します。以下は両側を空ける指定ですので片側だけにしたり数値を調整したりしてみてください。*1

>bodyにmarginが効かないブラウザがあります(IE)。
>bodyにmarginが効かないブラウザがあります(IE)。
>bodyにmarginが効かないブラウザがあります(IE)。
な、なんだってー!(AA略

よりによって最も利用者が多いIEブラウザでmarginが指定できないなんて…。私の場合は、body要素を含め全体的にmarginで微調整していた場面が多かったので、この事実は致命的。かといって、今のこのデザインを気に入ってしまったから変えたくない。となると、また次は、body要素にmargin指定をしない回り道のような記述方法を手探りしていかなければならない。
そんなの無理ー!ってことで考えた苦肉の策がこれ。サイドバーのprofileモジュールに乗っている文字列をご覧ください。

IE以外のブラウザ閲覧推奨)

まさかすぎるwww昨今のインターネットに於いて、IE以外のブラウザでの閲覧を推奨しているWebサイトがどれだけあるのでしょうか。その逆、IE閲覧推奨サイトなら星の数ほどあるだろうというのに、あえて逆をつく愚行に出てみました。要するに、cssを書き直すのが面倒で、匙を投げてしまっただけのことです。どうせ自己満足チラ裏ブログだし、自分が滅多にIE使わないし、こうなったらこのブログを見るときには絶対にIEは使わないので、もうこれでいいかな、と。
もしこのブログを見ている人でIEユーザーの方がいたら、この機会に別のブラウザを試してみてはどうでしょう。とにかく動作が速くサクサク動く「Google Chrome」、便利なアドオンを見つけてより快適なネットライフを送れる「Firefox」、アップル製品と連携しやすい「Safari」他、ブラウザも色々あって面白いですよ。そして、どうか崩れていないデザインでこのブログを閲覧してください(土下座)


サイドバーに、TwitterTwilogTumblrTHE INTERVIEWSmixiのリンクを載せました。Twilogに登録したので、ブログの方に呟きのまとめたエントリを挙げるのはやめ、過去の呟きカテゴリのエントリも消去しました。Tumblrは最近始めましたが、すっかり嵌ってます。気が向いたら、フォローとかよろしくお願いします。