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


リロード   新規 下位ページ作成 編集 凍結 差分 添付 コピー 名前変更   ホーム 一覧 検索 最終更新 バックアップ リンク元   ヘルプ   最終更新のRSS
Last-modified: Fri, 07 Mar 2008 14:00:57 JST (5886d)