为什么固定表格布局 td 字不换行？答案

【问题标题】：Why are fixed table-layout td words not wrapping?为什么固定表格布局 td 字不换行？
【发布时间】：2012-03-11 22:08:18
【问题描述】：

我有一个表格，其中填充了不同长度的文本。我已将表格布局 css 属性设置为固定，因为它不断将表格推到其父级之外创建水平滚动条。

我希望我的 td 正好是表的一半，这将是它的父级的全尺寸。我希望我的文本包含在 td 中。这是它的样子：

我希望文本环绕 20，这样它就不会与其他文本重叠。我不能使用<br />。

这是问题的JSFiddle。

【问题讨论】：

【解决方案1】：

您可以在p 上使用word-wrap: break-word。它可以在您的 jsFiddle 中运行，并且与 Microsoft 开发的 IE 兼容。

【讨论】：

【解决方案2】：

它没有中断的原因是字符串中没有空格。一旦您在一组数字中添加一个空格，它就会中断。因此，解决此问题的一种方法是将word-wrap:break-work 分配给p 选择器。

【讨论】：

【解决方案3】：

当您将容器宽度设置为较小时，请尝试增加容器宽度，Check JSFiddle for demo，宽度 250 将精确到 20 的位置。

#container
{
    width: 250px;
}
p
{
 word-wrap: break-word
 }

【讨论】：