ol, ulのスタイル

先日CSSを書いていてふと思い出したことを。ol要素、ul要素は、ブラウザのデフォルトスタイルだと左余白を40pxほどとって表示されるが、WinIEやOperaではこの余白がmarginでとられているらしいのに対し、Mozillaではpaddingでとられている。NN4は謎(margin-leftやpadding-leftを変えてみても左余白が変わらなかったので)。

なので、CSSを適用させる際にmarginとpaddingのどちらかしか指定していないと、一方のブラウザではリストの左側がおかしなことになる。リストマーカーが左ボーダーを飛び出してたりとか、あるいは右の方にかなりひっこんでたりとか。スタイルシートを作る際、ulとolにはmargin, padding両方指定するのがよさそうです。

といった話は既にどこかに書いてあるような気もしますが。

dd要素の左余白はどれもmarginでとられているようでした(NN4は上と同様の理由でやはり謎)。

(2002年9月9日)

北村曉 kits@akatsukinishisu.net