はたまた CSS と格闘
20 日に公開したサイトにブログをつけたいと言われたので、つけることにする。まぁつけるのはボクじゃないんだけど、設置された CGI にスタイルシートでデザインの統一をしなければならないのだが、それはボクがすることになった。
というわけで、ちまちまといじり、割と簡単に完成。
まぁまだタイトルバーに画像が必要だとか、影を入れなくちゃいけないとかあるんだけど、とりあえず色とレイアウトなどはそろった。よし、細かいところは忙しいのでまた今度と思ったのだが IE6 で見るとレイアウトが崩れることが判明。
マジスカ!
出たよ出たよ、Microsoft お得意の独自解釈かよ!
っつーわけであれこれ悪戦苦闘したが、ダメだ───────。
float を使うとどうしてもうまくいかない。でも二段組を実現するにはどうしても float をつかわなくちゃいけないしなぁ。
ちなみに IE7 や mozilla で見るとまったく問題ナッシング。
問題となっているのは、ブロックとブロックが離れている場合なのだ。
MenuBar {
float : left;
margin-left : 25px;
width : 160px;
}
Contents{
margin-left 210px;
width : 520px;
}
簡単に言うとこんな感じの定義なんだが、この定義だと Menubar と Contents の間には 25 ドットほどの隙間ができるはずなのである。ところが IE6 だとくっつくのよねぇ。まぁスタイルシートは他のスタイルとかの影響もあるので、ここだけ抽出してもしかたないのだけどさ。
で、IE6 でちゃんと表示できるように設定すると、今度は IE7 と mozilla でダメ。
もーこんなアホなことに何時間も費やしてしまったよ……。
結果的に float を使わずに position : absolute; をつかって回避。
ホントに時間の無駄だった……orz
#comment