table-layout:fixedでテーブルの列幅を固定する

ie7で、テーブルのセル幅指定が無視され、レイアウトが崩れてしまうという問題が起こりました。
どうやらie特有のバグみたいです。いつもながらieには本当に困らされます。

色々調べてみたところ、cssのtable-layout:fixedが使えそうなことが分かり、試してみました。

サンプル：table-layout:fixedでテーブルのセル幅を固定

table-layout:fixedを指定すると、最初の一行目でテーブルの列幅を固定するという働きをしてくれます。

さらに２行目以降のセルを描画する際に再計算をしなくなるので、ページの読み込みも早くなるようです。
ieのバグ回避以外でも使えそうだし、覚えておくとあとあと役に立ちそうなプロパティだと思います。

Excelの表をDreamWeaverにコピペしたらテーブルになった

タイトルのまんまなんですが、試しにやってみたら、見事にできました。



ソースはこんな感じ。


ちなみにそれぞれのバージョンは、Excelが2003、DreamWeaverが8です。

セルの背景色とかfont-weightとかはコピーされなかったので、属性情報は引き継がれないようです。

でもcolspanやrowspanなどはばっちりコピーされるので、使いようによってはかなりの効率化ができそうです。