2
私は3つの 'グループ'の列、左、中央、右を持つHTMLテーブルを持っています。テーブル内の1つのカラムをワードウィンドウでラップする方法
+----------------------------------+ | L-1 | L-2 | M | R1 | R2 | +-----+-----+------------+----+----+ | x | z | aaaaaaa... | 1 | 2 | | y | w | bbbbbbb... | 3 | 4 | +-----+-----+------------+----+----+
真ん中に非常に長い文字列（「M」）の列があるとき、私は、ブラウザウィンドウの幅にテーブルを閉じ込めるしたいと思います。
wordwrap a very long stringで説明されているように、この列でCSSの単語区切りを使用しようとしました。
以下はHTML（例示）です。 CSSには、どうすればいいのですか（しかし明らかにそうではない）に関する私の考えが含まれています。
私は間違っていますか？
<html>
<head>
<style type='text/css'>
table { /* nothing here - table is block, so should auto expand to as large as it can get without causing scrollbars? */ }
.left { text-align:center; }
.right { text-align:right; }
.middle { text-align:left; width:100%; /* expand this column to as large as it can get within table? */}
.wrap { word-wrap:break-word; width:100%; /* use up entire cell this div is contained in? */ }
</style>
</head>
<body>
<table>
<tr>
<th class=left>L-1</th>
<th class=left>L-2</th>
<th class=middle>M</th>
<th class=right>R-1</th>
<th class=right>R-2</th>
</tr>
<tr>
<td class=left>argle</td>
<td class=left>bargle</td>
<td class=middle><div class=wrap>wwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwww</div></td>
<td class=right>glyp</td>
<td class=right>glof</td>
</tr>
</table>
</body>
</html>
今の結果にはワードラップではなく、テーブルが不必要右端に出て撮影し、ブラウザのウィンドウにスクロールバーを引き起こし、場所をとらないということです。
ありがとうございました！ LとRの列にはユーザー入力が含まれているため、100ピクセルに固定することはできません。 – rosenfield