0

コンテンツをラップすることに抵抗し続けるテーブルセルがあります（スパン）。Chrome 開発ツールによるシナリオは次のとおりです。

には<td>次の規則があります。

overflow:visible;
white-space:normal;

持ってい<table>ます：

table-layout:fixed;

テーブルの最初の行には、固定幅が定義された 2 つの列があります。問題のあるセルにはpadding="2".

私の知る限り、そうするべきですが、内容をラップしていません。次のルールで失敗しました：

word-break: break-all;
word-wrap: break-word;
max-width: 120px; /*this is the max width I want to ensure*/

ここで何が欠けていますか？

4

1 に答える 1

1

あなたが投稿していないので、あなたのコードがどのようになっているのか正確にはわかりませんが、私はあなたの指示に従ったのでうまくいきました。

ここでそれを参照してください: http://jsfiddle.net/FJ7dB/

HTML:

<table>
    <tr>
        <td>TD-1-1</td>
        <td padding="2">
            <span>TD-1-2 ContentContentContentContentContentContentContentContentContentContentContentContentContentContentContentContentContent</span>
        </td>
    </tr>
    <tr>
        <td>TD-2-1</td>
        <td>TD-2-2</td>
    </tr>
</table>

CSS:

table{
    table-layout:fixed;
    border:1px solid blue;
}
td{
    width:120px;
    max-width:120px;
    word-break: break-all;
    word-wrap: break-word;
    border:1px solid red;
}

それが機能するのはmax-width、あなたが失敗したと言ったことです。

そして、それは設定する必要はありません

overflow:visible;
white-space:normal;

visibleとnormalはデフォルト値であるためです。

于 2012-08-16T23:45:31.953 に答える