问题标签 [nowrap]

HTML：

CSS：

IE 7 结果：

期望的结果：

标签在 ul 容器的右侧被切断。我已经尝试研究这个问题，我认为它与填充有关，但我无法弄清楚。适用于除 IE7 以外的所有浏览器。

我无法让这个极其简单的 jsfiddle 工作。它只是应该在单击按钮时提醒测试。我在这里想念什么？

http://jsfiddle.net/u9nG6/2/

所以我正在编辑 CSS 并且选项卡菜单有一个 whitespace: nowrap 属性，这意味着它不会重叠但最终会退出页面。即使使用 !important 和层次结构 CSS，设置选项卡菜单本身的宽度也无济于事。

看起来像这样

http://i.imgur.com/yxblJ.jpg

当我做 whitespace: pre 或任何其他时，它们最终会重叠。

我想做视差滚动效果。我使用了下面的方法，但是当添加子 DIV 时，它会换行：

我正在使用带有 jquery ui 主题的数据表，对于可排序的列，一些 TH 包装了用于对该列进行排序的小箭头图标。

我有大约 7 列正在显示。对于具有少量文本（不比实际 TH 文本宽）的 TD，箭头图标会在 TH 上换行。关于如何制作它的任何想法，以便所有 TH 标签都不会包装文本？我尝试将“sClass:nowrap”添加到每一列，然后创建一个使用 white-space:nowrap 的 css nowrap 类，但这仅适用于 TD 而不是 TH。

基本上需要一种方法来确保每列的最小宽度与 TH 内容一样宽（包括箭头）

简化后，我有三个元素 A、B 和 C。B 和 C 一起在一个 div 中。如果有足够的水平空间（浏览器窗口足够宽），我希望它们显示为

到目前为止微不足道。如果窗口变小，我希望它们像这样包装：

我通过给 div a 解决了这个问题style.whiteSpace = "nowrap"。问题是，即使没有足够的空间来显示它们，BC 现在也不会再包装了。当窗口变得更小时，我希望它显示为

所以我正在寻找的是一种更柔软的“nowrap”版本，如果有空间可以避免包裹，但如果没有，则允许包裹。

编辑：

回复通过使一切浮动解决了上述问题：http: //jsfiddle.net/nF4k5/6/

这让我意识到我的简化太过分了。实际上，在我的应用程序中，A 是一个文本，并且本身具有换行功能，因此有时会填充整个宽度。可以将 B 和 C 想象为应该出现的单个单词 a) 一起出现在文本 A 的最后一行中，或者如果它们不适合一起出现 b) 在新行上，或者如果该行太短 c) 在两行上。

我做了一个例子来玩：http: //jsfiddle.net/nF4k5/5/

更小的屏幕应该会导致：

如果解决方案不涉及对 A 进行更改，就像我在 BC 周围的 div 中添加 nowrap 一样，那将特别好，这不起作用。

编辑：解决方案：我没有给 B 和 C 的包装器一个 whiteSpace="nowrap"，而是给它一个 display="inline-block"。

这是网络上一个高度讨论的问题，但经过数小时的研究和反复试验，我仍然无法让下面的 HTML 在 IE 7、8 或 9 中按预期运行：

所需的行为如下：

• .box 元素不得换行 - 滚动条应出现在窗口底部
• .box 元素必须具有固定的宽度和高度
• .container 和 .childContainer 不能有固定宽度。.box 元素的数量是任意的
• 必须在 IE7+ 和最新版本的 Chrome 和 FireFox 中合理一致地运行

提供的 HTML 在 Chrome 中有效，我相信它尊重 white-space: nowrap 即使对于块元素。我尝试过使用 SPAN 元素，但需要将它们强制为带有 float: left 的块元素，否则将忽略宽度属性。然后它们具有与 DIV 元素相同的问题。

我确信必须有一个不使用 JavaScript 的解决方案，但如果所有其他方法都失败了，这是一个选项。