Top > Diary > 2007-03-22

はたまた CSS と格闘

FTS0300.png

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


Reload   New Lower page making Edit Freeze Diff Upload Copy Rename   Front page List of pages Search Recent changes Backup Referer   Help   RSS of recent changes
Last-modified: (5324d)