【メモ】tableのカラム幅がwidth指定しても固定されない場合

あるあるですが、記載の仕方を忘れることがあるので、メモ。

特にPHPなどで動的にtableを作成する場合によくありますよね。thやtdの幅をwidthで指定しているのに、上手く幅指定が出来ていないこと。そういった場合の対処法です。

table-layout: fixed;

カレンダーを動的に作る時などに、幅を固定する際、

th.week, td.week {
    width: calc( 100% / 7 );
}

よくある方法ですが、tdの中に動的に文字（文字数がどれくらいになるかわからない時）を入れたりすると、結構レイアウトが崩れます。その時は、最後の手段「table-layout: fixed;」で解決できることがあります。

どうしても固定されないなら、動的に文字の入るブロック要素に

    white-space:nowrap;
    overflow:hidden;
    text-overflow: ellipsis;

で、はみ出る文字を消す、かな。