word-wrap:break-word 在 IE8 中不起作用
Posted
技术标签:
【中文标题】word-wrap:break-word 在 IE8 中不起作用【英文标题】：word-wrap:break-word not working in IE8 【发布时间】：2011-04-29 04:10:45 【问题描述】：谁能告诉我为什么 word-wrap: break-word 在 IE8 中不起作用？
我在其他浏览器中也有此功能，但 IE8 拒绝收听，尽管在他们的网站上阅读了这篇文章？
http://msdn.microsoft.com/en-us/library/ms531186(VS.85).aspx
谢谢
【问题讨论】：
它说，就在您链接到“CSS -ms-word-wrap : sWrap ”的页面顶部，您为什么希望无前缀版本可以工作？ @robertc：我认为非前缀版本通常仍然可以在 IE 8 中使用？如果他们不这样做，一堆网站就会在 IE 8 中崩溃。 @PaulDWaite 我认为这是在测试版中没有前缀并最终在发行版中添加前缀的东西之一？ 我尝试了有前缀和无前缀的版本。在他们的例子中，它实际上也没有前缀。 谢谢大家，我终于来对了 【参考方案1】：查看 Microsoft 的示例代码后：https://msdn.microsoft.com/en-us/library/ms531186%28VS.85%29.aspx
我设法通过以下添加解决了我的 IE-8 问题 文档和标题：
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN">
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
...然后使用这个（官方）CSS 指令：
word-wrap: break-word;
【讨论】：
看起来很沉重。我不认为我会向任何人推荐使用 IE7 糟糕的渲染引擎来制作应用程序，只是为了断词。特别是因为这将使 IE9 及更高版本呈现为 IE7。 投反对票是不公平的！至少它确实对我有用。一个糟糕的解决方案，但仍然是一个解决方案。【参考方案2】：你可以使用
-ms-word-break: break-all;
【讨论】：
请在您的回答中添加一些额外的解释。 MDN 明确指出： > IE8 引入 -ms-word-break 作为 word-break 的同义词。不要使用 -ms- 前缀。【参考方案3】：试试这个 word-break: break-all; ，对于 IE8 和 IE9，它正在工作 :)
【讨论】：
简单有效...！ 只是想指出“word-break”和“word-wrap”是两个不同的东西。在以下示例中，“word-break: break-all;”会将“consectetuer”一词切成两半，而“word-wrap:break-word”则不会。 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 这真的不是一回事。即使没有必要，Break-all 也会在中间打断单词。断词只会在一个词不能单独放在一行时才会断词。【参考方案4】：我发现要将word-wrap 应用于td（表格单元格），我需要使用table-layout: fixed 设置table 元素的样式。 （IE8标准模式。）
【讨论】：
chrome也需要这个 非常感谢！我需要这个来在 orbeon 渲染器的表格单元格中使用自动换行。 仅仅使用table-layout: fixed 是不够的。你还需要使用width
太好了，它保持了 witdhs 的完整性。它适用于 IE7+、Chrome、Mozilla、Safari。可以做如下的事情，只要给table标签一个“table-wrap”类： .table-wrap table-layout: fixed; .table-wrap tr tdword-wrap:break-word;
【参考方案5】：
如果我没记错的话，Internet Explorer 8 确实支持word-wrap: break-word;，但样式元素必须have layout。
【讨论】：
是的。 OP链接的页面就在那里说：This property applies to elements that have layout. An element has layout when it is absolutely positioned, is a block element, or is an inline element with a specified height or width.
将display: inline-block; 添加到元素修复了word-wrap:break-word; 不会在IE8 上触发的问题。给它一个布局 `display: inline-block;解决了这个问题，并且在所有浏览器中都能正常工作。布局非常重要。很好的链接，可以在答案中通读。谢谢！以上是关于word-wrap:break-word 在 IE8 中不起作用的主要内容，如果未能解决你的问题，请参考以下文章
word-wrap:break-word 不适用于 iText 2.1.7
CSS中的“word-break：break-all”与“word-wrap：break-word”有啥区别
我可以将 word-wrap:break-word 设置为提交类型的输入吗？