テーブル内widthでの改行処理がIEとFirefoxで異なる

質問

テーブル内のtdに対してwidthを指定していますが、IEとFirefoxで表示が異なります。具体的には下記のコードにて、【文章１】が長い場合、IEではwidth:160pxで自動改行するのですが、Firefoxでは改行されず横に表示されてしまいます。
いちいち改行文字を入れるのはめんどうなのでFirefoxでも自動改行されるようにしたいのですが、何かうまい手をご存知の方、ご教示願います。

＜スタイルシート＞
#contact_table table {
width:600px;
padding:auto;
margin:auto;
text-align:center;
border-collapse:separate;
}

#contact_table tr {
padding:auto;
margin:auto;
text-align:center;
}

#contact_table td {
padding:5px;
margin:5px;
border-top:solid 2px #EEEEEE;
border-left:solid 2px #EEEEEE;
border-right:solid 2px #C0C0C0;
border-bottom:solid 2px #C0C0C0;
font-size:12px;
font-weight:normal;
color:#000000;
text-align:left;
line-height:1.5em;
background:#DAEAF3;
}

#contact_table td.item {
width:160px;
white-space:nowrap;
background: #000080;
text-align:center;
border-top:solid 2px #0000CC;
border-left:solid 2px #0000CC;
border-right:solid 2px #000033;
border-bottom:solid 2px #000033;
color:#FFFFFF;
}

＜HTML＞
<div id="contact_table">
<table summary="お問い合わせ">
<tr>
<td class="item">【文章１】</td>
<td>【文章２】</td>
</tr>
<tr>
<td class="item">【文章１】</td>
<td>【文章２】</td>
</tr>
・・・
</table>
</div>

回答No.1

abril · ベストアンサー

"white-space:nowrap;"を削除して下さい。これがtdに設定されているので行内容を折り返さない、という状態になってしまっています。
white-spaceプロパティの仕様をググるなりして把握しておくことをお奨めします。

お礼

さっそく試したところ、Firefoxでも折り返す表示となりました！
ありがとうございます！