テーブルのレイアウトがおかしくなる

質問

畏れ入ります。
テーブルを作っているのですが奇妙な現象にあっています。

<table border="1" width="100%">
<tr>
<th width="18">&nbsp;</th>
<th width="100">&nbsp;</th>
<th>&nbsp;</th>
<th width="100">&nbsp;</th>
</tr>
<tr>
<td rowspan="2">&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td colspan="3">&nbsp;
<!-- ここに　たくさんの　文字列を入れると　・・・　-->
</td>
</tr>
</table>

このコメントの部分が無い状態では正常にでていますが、
ここにたくさんの文字列（半角30文字程度でおかしくなります）を投入すると、レイアウトが異常に崩れてしまいます。
文字列は改行してもかまわないのですが
テーブル1行目2行目のセルサイズ（width）がこのように変化してしまうと困るのです。
どのようにしたら良いか（width=100の部分を守らせたい）
教えてください。

回答No.2

cobun5513 · ベストアンサー

<table border="1" width="100%" style="table-layout: fixed;">
としてみてください。

#1さんのは行末の禁則処理ですので、ブラウザによっては反応しません。
（mozira系は#1さんのでもいけます。）

お礼

ああああ！！出来ました！！
ありがとうございます！！

fixed
最初の横一行を読み込んだ時点で、各縦列の幅を決定して表示を開始します。

デフォルトでこうなのかと思い込んでいましたが、違うのですね。

回答No.1

site_uma

スタイルシートで以下のように指定してみてください。
<table border="1" width="100%" style="word-break: break-all;">

補足

回答ありがとうございます。
早速調べてみました！

break-all
言語に関係なく表示範囲に合わせて改行されます。このため単語の途中で改行されることもあります。

おお、ぴったりだと思ったのですが、だめでした・・・

そもそも半角30文字程度では改行しません。まだ範囲まで行っていません。
なぜレイアウトが狂うのでしょうか・・・