1. ホーム
  2. html

[解決済み] word-wrap break-word は、この例では機能しません。

2023-03-08 20:22:40

質問

この例では、word-wrapがうまくいきません。

<html>
<head></head>
<body>

<table style="table-layout:fixed;">
<tr>
<td style="word-wrap: break-word; width:100px;">ThisStringWillNotWrapThisStringWillNotWrapThisStringWillNotWrapThisStringWillNotWrapThisStringWillNotWrapThisStringWillNotWrapThisStringWillNotWrapThisStringWillNotWrapThisStringWillNotWrap</td>
</tr>
</table>

</body></html>

私はレイアウトが指定されなければならないことを読んだのを思い出しました(私はそれをしました)、しかし、それ以上に、私はこれが動作するようにするために何をしなければならないかわかりません。 私は本当にこれがFirefoxで動作するようにしたいです。 ありがとうございます。

EDIT。 Chrome 19 と Firefox 12 で失敗しましたが、IE8 では動作しました。 doctype strictとtransitionalを試しましたが、どちらもうまくいきませんでした。

どのように解決するのですか?

Mozilla Firefox 解決策

追加します。

display: inline-block;

のスタイルに td .

Webkit ベースのブラウザ ( Google Chrome , サファリ ...)ソリューション

追加します。

display: inline-block;
word-break: break-word;

のスタイルに td .

注意 気にする、今のところ。 break-word は webkit の標準仕様には含まれていないことに注意してください。 break-all を採用することに興味があるかもしれません。この代替値は間違いなく抜本的な解決策を提供しますが、標準に準拠しています。

オペラ ソリューション

追加します。

display: inline-block;
word-break: break-word;

のスタイルに td .

前項はOperaにも同様に適用されます。