今更ながら

昨日の「IE8がWebDAVクライアントにならない」件もそうだが、当たり前のことなのに“知らない”と言うか気に留めていなかったことがあまりに多いのに愕然としている。

例えば、HTML・CSSにおけるボックスのセンタリング。
div要素で囲まれた範囲を中央寄せしたい場合、margin-left: auto;　margin-right: auto;と、marginの左右に”auto”を指定すれば実現できるはずだが、IEに適用されないので色々と試行錯誤していた。
これは結局IE6以前のバグで、回避策として親ボックスに"text-align: center;"を指定して全体をセンタリングし、子ボックスに"text-align: left;"を指定して子ボックス内の表示を元に戻すしかかなった（厳密にCSS定義としては間違っているが、IEへの「仕方の無い対応」）のだが、バグであるということに気づかず、"margin-・・・: auto;"の方がダメなのだと思い込んで、おかしなcssを書いていた。

また、"text-align: justify;"も、存在自体を忘れていた。IE6以降限定ではあるが、そろそろ使ってもいい時期だろう。

もう一つ。なんとかマスターしたい技術に「float」がある。
画像のfloatは多用しているが、「フロートには width の明示が必要」という認識が欠落していた。width を明示しなくても画像はちゃんとフロートするので、CSS で画像以外のものをフロートしようとしたときに良くはまる罠になる。ボックスが回り込まずに下に表示さたりするのだが、画像と違ってテキストの「幅」は改行するまで決まらないので、動きが一定せず「なぜ？」と思っていた。
ボックスの幅をピクセルで固定する場合は何のことはないのだが、フロートする画像の隣にテキストボックスを段組的に配置したいという場合に悩んでいる。