HTML Force 引入中断/新行答案

【问题标题】：HTML Force introduce break/new lineHTML Force 引入中断/新行
【发布时间】：2012-02-24 21:54:36
【问题描述】：

我有一个固定宽度的表格单元格...

现在此单元格内的内容/文本字符长度会发生变化，并且不能总是在其之间留有空格，这会导致布局稍微中断。

我尝试通过添加 CSS word-wrap:break-word 来修复但由于某种原因，这并不总是有效。

即使文本之间没有空格，我如何确保我的文本换到下一行？

【问题讨论】：

【解决方案1】：

我编辑了你的 jsfiddle 以便它可以工作：

您所要做的就是在表格样式中添加：style="table-layout: fixed"，并为您的单元格添加一些固定宽度。

【讨论】：

非常感谢您的帮助...但是在更新的小提琴中，我仍然在同一行中看到长文本并且实际上并没有换行到下一行..
再次感谢...所以我需要以 % 指定 td 宽度吗？我得到一个文本重叠（就像你之前的小提琴一样）
@testndtv ：好吧，您可以删除宽度。当我使用 Chrome 时，我注意到它会自动为您的单元格提供相同的宽度（您可以在这里看到它：jsfiddle.net/Dnzra/3）

【解决方案2】：

实际的解决方案是在允许直接换行的任何位置插入标签<wbr>，例如

<td>MaxUName<wbr>MaxUName<wbr>MaxUName<wbr>MaxUNa</td>

为了更好地覆盖旧的<wbr>（它从未成为任何标准，但仍然活跃且活跃），请将以下内容添加到您的样式表中：

wbr:after { content: "\00200B"; }

【讨论】：

实际上我的文本内容是动态的（来自数据库）...所以我不能按原样编辑它...还有其他方法可以解决这个问题吗？
CSS 设置 word-wrap:break-word 对浏览器的支持有限。如果您认为在任何地方都允许换行，则可以在处理从数据库或 JavaScript 中的客户端获取的动态数据时在每个字符后插入 <wbr>。