html - HTMテーブル幅拡張の難しさ

Question

私は私のウェブページのこのセクションで問題を抱えています。そこではたくさんのテストワードを見ることができます。私がやろうとしているのは、tdの高さを自動にして、メッセージが送信されるたびにその幅が拡大しないようにすることです。私はそれの幅のプロパティを制限してきましたが、それは機能しません、私はcssで表示ブロックを持っていることも試みましたが、それはまったく役に立ちません、この問題を解決するための最良の方法は何ですか？ここに画像があります：http： //img209.imageshack.us/img209/4439/errrorx.png

これは私のテーブルのコードです

<table  class="itemlist" width="100%" cellspacing="1" cellpadding="4">
    <tr class="det_msg">
        <td><?php echo $detail ?></td>
    </tr>
</table>

これがcssの私のコードです

.det_msg td{
    margin:6px; 
    width:920px;
    color: #fff;
    border-bottom:1px solid #333;
    font-family:Arial;
    font-size: 12px;
    color: #000000;
    margin-left:100px;
    padding:50px;
}

Answer 1

ここに私の解決策があります:

.itemlist {
    table-layout:fixed;
}

.det_msg td{
    word-wrap: break-word;
    word-break: break-all;
}

jsFiddle デモ: http://jsfiddle.net/NkfNf/1/

しかし実際には、あなたの問題は、信じられないほど長い「単語」（空白なし）をその td に挿入したことです。ブラウザが正しく分割するのは難しいため、分割されず、1 行で表示されました。

そのため、より良い解決策: Web 上でそのような「長い単語」を表示しないようにしてください。

Answer 2

<table class="itemlist" width="100%"...<--- 100% にしないで、値にします