使用 CSS 将损坏的 html 表格放入特定宽度内答案

【问题标题】：Fitting a broken html table inside a specific width with CSS使用 CSS 将损坏的 html 表格放入特定宽度内
【发布时间】：2013-12-28 07:08:09
【问题描述】：

我有以下损坏的 html，我无法真正编辑，也无法使用 javascript 进行修改，我正在尝试使其适合 x 宽度：http://jsfiddle.net/P7A9m/2/

<div id="main">
    <table>
        <tr>
            <td>
                test
                test
                longWooooooooooooooooooooooooooooooooooooooooord
                test
            </td>
        </tr>
        <tr>
            <td></td>
            <td></td>
        </tr>
    </table>
</div>

（我知道数量不匹配，但如果第一个 tr 有 2 个 td，问题将是相同的。）

现在，我不能使用“table-layout: fixed;”并将表格设置为与父 div 相同的宽度，因为它会使内容仅使用 50% 的可用空间。有什么方法可以做我想做的事吗？

【问题讨论】：

您可以使用 css word-break: break-all;（仅限较新的浏览器）或将其包装在设置宽度并隐藏溢出的 div 中

标签： html css width html-table

【解决方案1】：

我认为你需要 css 属性：

word-break: break-all;

【讨论】：

谢谢，看来我想看看我使用 break-word 而不是 break-all btw 的分词规范，它有点不那么激进:)

【解决方案2】：

使用

word-wrap:break-word;

这甚至适用于 IE6，

或

word-break: break-all;

【讨论】：