一応このページはXHTML 1.0 Strictに準拠するように作っている（つもり）。でも、XHTMLに準拠しているからと言って、どのブラウザでも同じように見えるかと言えば、そんなことは全くない。最近はこの対応に追われている…

今使っているパソコンには、

• IE6.0
• Mozilla Firefox 1.06
• Netscape 7.1
• Opera 8.01

の4つのブラウザを入れている（もちろん以前紹介したIEコンポ使用のMDIBrowserも入っている）。このページのデザインを考える場合は、必ずこの4つのブラウザでその見栄えをチェックしている（Macはないのでチェックしてません:-s 悪しからず）。

ところが今回苦戦しているレイアウトは、ブラウザ毎に完全にデザインがずれてしまう:'( 特にIE!! お前だお前!! IEはCSSのfloatに弱い。おかげでfloatを使ったレイアウトがずれまくる:-s

ここからはHTMLとCSSの専門的な 話。

K@tsukun's PAGE!によれば、

このプロパティの対象となる要素には，何らかの方法で幅を明示しなければなりません（widthプロパティなどで割り当てるか，置換要素の場合は内在する幅が流用される）。CSS2仕様では，幅が明確ではないフロートの幅は '0' とみなされます。

となっている。置換要素とはimgタグなどの外部から持ってきたものによって勝手にサイズの決まるもの（かなり大胆な説明:-s ）です[参考: CSS1-整形モデル]（それ以外の中身でサイズが決まるものを非置換要素と言います）。つまり、画像をfloatさせる場合は横幅指定しなくてもいいけど、その他の場合は横幅を指定しなさい、ってことです。

じゃあブロック要素の中に置換要素（imgタグ）を入れてfloatさ せる場合は?? 定義を探したけど、よく分からない:-s 実際にwidthを指定しないでやってみると、上記4つのブラウザでいい感じにまとまる。じゃあこれでいいのかな:-p なんて思っていたら、ちゃんとレイアウトはされているものの、微妙な位置関係がずれている。

続きはまた後日…