html - 如何制作宽度固定但高度固定的 table ？

我很难制作一个重现我的问题的jsfiddle，但是我有一个jsfiddle演示了我正在处理的基本布局。
http://jsfiddle.net/LurUM/4/

<div style="width: 73%; float: left;">
    <!-- table here -->
</div>
<div style="width: 23%; float: right;">
    <!-- sidebar here -->
</div>

我有一张桌子在像这样的一页上，但是它的宽度不正确，它要宽得多，与右边的横杆相撞，并越过它。我试着将表格的宽度设置为100%，并转到固定的表格布局。宽度的表现与我所希望的完全一样，但随后表格单元格中的一些文本溢出并与其他列中的文本冲突。我想要的是单元格变得更高，文本进入一个新的行而不是溢出，但如果我理解正确的固定布局是防止这一点。
我对情况的理解是否正确？解决办法是什么？为什么桌子一开始就有这么多额外的宽度？

最佳答案

请尝试以下代码：

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

word-wrap: break-word属性将把长单词包装到下一行并调整单词，使它们不会打断中间的单词。当与table-layout: fixed;一起使用时，它将防止表边界溢出。

关于html - 如何制作宽度固定但高度固定的 table ？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/22151367/