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，文本将被隐藏。我也不想要滚动条。

我希望输出像this。

如何通过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>