我有一个带有3个“组”的HTML表格,左侧,中间和右侧。如何在表格中自动换行一列,并将表格大小设置为浏览器窗口
+----------------------------------+
| L-1 | L-2 | M | R1 | R2 |
+-----+-----+------------+----+----+
| x | z | aaaaaaa... | 1 | 2 |
| y | w | bbbbbbb... | 3 | 4 |
+-----+-----+------------+----+----+
我想将表限制在浏览器窗口的宽度,当中间(“M”)列中有一个非常长的字符串。
我试图在此列上使用CSS word-break,如wordwrap a very long string中所述。
下面是HTML(例示)。 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? */ }
L-1 | L-2 | M | R-1 | R-2 |
---|---|---|---|---|
argle | bargle |
wwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwww
| glyp | glof |
,现在的结果是,没有单词环绕发生,而不是表不必要地拍摄出最右侧,并导致在浏览器窗口滚动条。