有关空白的帮助：IE 中的 nowrap 和 normal

Question

我无法弄清楚这一点...

我有一个名为“#ContentContainer”的 div，它的宽度是 100%，它需要一个 nowrap 的空白，所以它的内部结构会展开和折叠，会冒险到窗口之外并创建水平滚动。在展开和折叠的 div 中，我有文本和图像。在 IE 中，这些内部 div 具有空白：nowrap 应用于它们...我已将空白设置为正常，但 IE 无法识别..任何人都可以帮忙吗？

这里是 CSS：

#ContentContainer {
    position: relative;
    height: 480px;
    width: 100%;
    margin: 10px 0px 0px 0px;
    border: 1px solid blue;
    white-space: nowrap;
}

.column {
    position: relative;
    white-space: normal;
    width: 220px;
    top: 0px;
    border-left: 1px solid #999;
    border-right: 1px solid #999;
    height: 420px;
    margin: 20px 30px 0px 0px;
    *display: inline;
    vertical-align: top;
}

和我的 HTML：

<div id="#ContentContainer">
    <div class="column">
        Text that needs to have a white-space or normal.  It needs to wrap.  Text that needs to have a white-space or normal.  It needs to wrap.  Text that needs to have a white-space or normal.  It needs to wrap.  
    </div>

    <div class="column">
        Text that needs to have a white-space or normal.  It needs to wrap.  Text that needs to have a white-space or normal.  It needs to wrap.  Text that needs to have a white-space or normal.  It needs to wrap.  
    </div>

    <div class="column">
        Text that needs to have a white-space or normal.  It needs to wrap.  Text that needs to have a white-space or normal.  It needs to wrap.  Text that needs to have a white-space or normal.  It needs to wrap.  
    </div>

</div>

有人吗？

Answer 1

所有版本的 IE 都支持 white-space:nowrap 属性，因此这应该适合您。

您的问题不是 CSS，而是 HTML 中的错误：您有

，但这是不正确的：HTML 代码中的 ID 不应包含哈希符号 (#)。 CSS 代码中需要引用 ID，但 ID 本身不应包含它。

所以你的 CSS 是正确的：

#ContentContainer {
   ....
}

但你的 HTML 应该如下所示：

<div id="ContentContainer">
    ....

希望有帮助。

Answer 2

近三周后，谜团终于解开：似乎正确地解析和级联了 CSS 指令 white-space:normal;，但真正并没有用它做任何事情（从而有效地使白色-space:nowrap; immortal) 是 IE 5.5 中的一个错误。进入某种“兼容模式”或“怪异模式”的更高版本的 IE 可能会重复这种错误行为。它的外观受到 IE 的确切版本和 DOCTYPE 内容的影响，甚至受到 Intranet 与 Internet 的影响（这解释了为什么它对很多人来说根本不显示，以及为什么这么多答案似乎不存在）很有意义）。

消除这种错误行为的确定方法是强制所有版本的 IE 使用更新的渲染模型（下面的示例使用“每个版本能够支持的最新渲染模型”），这需要向它们发送 X-UA-Compatible HTTP 标头，如果可能的话，可以从 Web 服务器发送，也可以在每个相关文档中作为后备。对于 Apache 服务器，添加到 .htaccess 的命令类似于对于

Header set X-UA-Compatible "IE=edge,chrome=1"

PHP，它应该只是添加几行代码，而对于 IIS，它应该只是添加配置。 （您还可以尝试仅使用 HTML 文件发送此标头和/或仅将其发送到 IE 浏览器的优化。）

如果您无法更改服务器的行为，则后备方法是在 中添加每个相关文件在所有 Javascript 或 CSS 之前，类似于

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">