テーブルをセンタリングしたい

テーブルをセンタリングしたくて、調べるとすぐ見つかった。
http://www.mozilla.gr.jp/standards/webtips0004.html#c1

<div style="margin-left:auto;margin-right:auto;width:10em;">

このままだとど真ん中にはならなかったので、
なんとなくwidthの数字を調整して50とか70とかでバッチリOK。

はい、一丁あがり。

と、今までのぼくならここで終わりなんだけど、今日はちょっと違う。
今年はCSSをちゃんと理解して、少しずつ身につけていきたいと思ってる。

まず、

width:10em;

「em」ってなんだろ？
http://d.hatena.ne.jp/akumakario/20080130
なるほど。詳しく書いてある。

他のサイトでは端的に

使用するフォントサイズを１とする単位。10emならば、10文字分の長さを表す。

って書いてある。
つまりセンタリングしたいテーブルの幅か、それよりも大きい幅を指定すればいいわけだ。
「em」でなくても「px」や「%」でもいいんだろうな。

次に

margin-left:auto;margin-right:auto;

marginってふつう5pxとかって幅を指定して、上下左右に余白を作るやつだ。
「auto」ってなんだろ？

http://d.hatena.ne.jp/seto-san/20081215/1229334745
なんかよく分からないけど、やはりセンタリングに使うらしい。
しかもieではセンタリングされないらしい。
ふむふむ。
でも「auto」っていう指定ってブラウザにおまかせしてるように見えるし、
センタリングされなくても文句は言えないんじゃないだろうか？？
って素人考えかな。

http://www6.plala.or.jp/go_west/nextcss/ref/article/calc_h.htm
これを見てようやくどういう処理でセンタリングされるのか理解できた。
firefoxで見るとこのサイト自体のレイアウトが崩れてて、ちょっと疑わしい部分もあるけど・・・

今日はここまで。