IE10 不支持空格：预包装？答案

【问题标题】：IE10 doesn't support white-space: pre-wrap?IE10 不支持空格：预包装？
【发布时间】：2014-01-28 21:22:53
【问题描述】：

我在可调整大小的div 中有一个pre 标记。当用户扩展或缩小div 时，pre 的宽度会拉伸或收缩。如果文本长于pre 宽度，则会被分到下一行。

我将这个 CSS 用于 pre：

pre {
 white-space: pre-wrap;       /* css-3 */
 white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
 white-space: -pre-wrap;      /* Opera 4-6 */
 white-space: -o-pre-wrap;    /* Opera 7 */
 word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

这适用于 FF、Chrome、IE8 和 IE9，但不适用于 IE10。

在 IE10 上，当用户展开它时，如果宽度足够，文本会转到上一行。它工作正常。但是当用户缩小它时，事情就变糟了。文本将被隐藏而不是被分到下一行。

我将 IE10 的 white-space: pre-wrap 更改为 white-space: pre，它会破坏文本。但是，英文单词也会被破坏。我想保持每个单词不换行。

【问题讨论】：

你可以使用modernizr.js来验证！
不可重现。请提供一个完整的示例，带有文本上下文示例。
这可能无济于事，但在这种情况下，建议将无前缀版本放在最后，低于供应商前缀版本。

标签： html css browser internet-explorer-10

【解决方案1】：

IE10 确实支持white-space: pre-wrap。但是 IE10 对元素的宽度有严格要求。

我为 wapper 容器使用了可调整大小的小部件，但忘记调整 <pre> 的宽度。如果我在使用扩展或缩小包装器<div> 时调整/声明<pre> 的宽度，它将被修复。

【讨论】：

你能澄清你的答案吗？我听不懂你在说什么。
@iconoclast 我将<pre> 放在一个可调整大小的<div> 中。问题是因为我调整了外部<div> 节点的大小但忘记更新<pre> 的元素宽度。