html - HTML中的自动行高调整

Question

我想将我的文本包装在单元格内，以便所有单元格的宽度都相等。换行后不应隐藏文本。这是我的桌子-

<table border="2" width="20px">
<tr>
<td>testtesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttest</td>
<td>test</td>
</tr>
<tr>
<td>test</td>
<td></td>
</tr>
</table>

随着wordwrap:break-word，文本被隐藏。我也不想要滚动条。

我希望输出是这样的。

CSS如何实现这一点？为我指明正确的方向。

Answer 1

http://jsfiddle.net/fekSg/。使用 fixed 进行表格布局，并使所有 td 元素换行

<style>
td {
word-wrap: break-word;
}
</style>
<table border="2" width="100px" style='table-layout:fixed;'>
<tr>
<td>testtesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttest</td>
<td>test</td>
</tr>
<tr>
<td>test</td>
<td></td>
</tr>
</table>