问题标签 [nowrap]

我目前正在开发一个新的 Web 项目，它是一个水平滚动的投资组合网站。我快完成了，只有一段代码不能像预期的那样工作。

我在屏幕左上角有一个汉堡菜单，其中包含应该平滑滚动到引用 id 的锚链接。问题是，一旦您滚动页面，滚动距离就会变得混乱，滚动距离就会完全混乱。

这是该页面的链接：http ://www.timbrack.de/#portfolio

要重现错误，请点击汉堡菜单并单击“关于”，即使关于在投资组合部分的右侧，它也会向后滚动几个像素......

我使用 white-space: nowrap 让容器像这样水平放置：

滚动脚本如下所示：

你们知道为什么滚动距离会如此混乱吗？

干杯蒂姆

IE 没有正确响应nowrap CSS 属性。

问题：如何在 IE 中进行这项工作，以便它呈现为 Chrome 的呈现结果。

http://jsfiddle.net/subsari/tmz0t0z2/3/

如何让 IE 像 Chrome 一样渲染表格？最干净的解决方案？

提前感谢您的帮助！

我的 textarea 的 nowrap 不起作用。有人可以告诉我我做错了什么吗？这是我来自 .php 文件的代码：

这是来自CSS：

我有一个 HTML 页面，里面有几个 div：

#given由第三方提供并具有明确的width设置，但该宽度可以通过 JavaScript 更改。

#one, #two,#three并且#four都具有隐式宽度。

#three有一个样式表，如：

#four包含大量文本并且完全溢出#three，但溢出是隐藏的，直到#three悬停。
现在#four我想申请text-overflow: ellipsis;，但这似乎也只有在white-space: nowrap;设置时才有效。但是，这会向左延伸#three几千#four个像素，这绝对不是我想要的。
到目前为止，我还没有找到其他明确设置宽度的解决方案#four，这（可能，但非常）非常不切实际，因为 的宽度#given不是固定的。

有没有非 JS 的方法来做到这一点？

这是我的问题：https ://jsfiddle.net/zquL7sem/3/

我的目标是让红色边框内的区域在蓝线处结束，并在文本结束处显示三个点，而不为#threeor设置明确的宽度#four。

很感谢任何形式的帮助。

为什么我会出现换行符？我使用以下内容： White-space: nowrap; 但是当我填写跨度时，会出现换行符。这是什么原因造成的？

我有一个水平项目列表，按 display:table-cell 排列。

中间项的内容长度可以不同，它应该相应地扩展。显然，它的兄弟姐妹应该缩小以腾出空间。

这是我到目前为止所做的示例：

http://codepen.io/Pictor13/pen/mJoyXw

但是当内容增长时，中间项目仍然溢出右兄弟。

有没有可能实现我想要的？是display: table-cell和white-space: nowrap正确的方法吗？

注意：宽度（如果指定）应始终是通用的，而不是固定为特定的 px/em。

谁能给出一些提示（或完整的解决方案！）如何将模型库代码示例“鼠标拖动多个示例”转换为非包装世界。我的尝试破坏了选择矩形（矩形的边在边缘堆积 - 因为每个部分都是单独处理的）。同样，选定的海龟只是堆积在边缘。谢谢你。

Here's the main procedure from the model - it gives a runtime error on the second setxy when the side of the selection rectangle gets to the edge of the non-wrapping world:

我有大量的表格数据，其中需要始终显示最左边的列，并且每行应该只占用一行 - 这可以通过 CSS 指令来实现white-space: nowrap。

我选择了DataTables jQuery 插件以及它的FixedColumns 扩展，它非常适合我想要做的事情。

但是，Internet Explorer（我手头有 11 版）我看到网格没有正确对齐 - 固定列有自己的滚动条，并且表头不再与其对应的列完全对齐。

我创建了一个 JSFiddle 来演示这个问题 - http://jsfiddle.net/tczwysao/11/。您可以看到，如果您注释掉 white-space 指令，那么列就会对齐。但我确实需要最左边的列保持在一行。

我实施此方法的方式是否有错误，或者任何人都可以提出解决方法？

我已经使用white-space: nowrapanddisplay: inline-block强制在同一行上放置两个元素，然后White-space: normal在这些元素中设置以允许里面的文本正常换行。

问题在于，由于某种原因，文本不会换行，直到视口的宽度小于元素之一——而不是两者。

我创建了一个小提琴来进一步解释这一点：https ://jsfiddle.net/krkb8d9L/1/ 。请注意，您需要将窗口缩小到 100 像素（最左边元素的宽度），比通常在文本开始换行之前要少。

有人可以解释为什么会这样吗？它似乎在浏览器之间也是一致的。我显然希望文本在它不适合时立即开始换行（例如，如果元素是浮动的）。

我在这个网站上工作： http: //sbw.aaugirlsbasketball.org/

客户说他在 Windows 10 机器上使用 IE 11，标题“AAU Girls Basketball”在特定分辨率下分成 2 行。<header id="skin_header">这些是在标签上使用 IE 中的 Inspect Element 时发现的近似屏幕宽度：

1. 1320px 宽：好的
2. 1300px 宽：分成两行
3. 1140px 宽：好的
4. 1065px 宽：分成两行
5. 984px 宽：变小但仍然损坏，从这里文本大小发生变化但继续损坏，直到 760px 再次变好。

这是一个屏幕截图：

正如您在下面的 CSS 中看到的那样，我们尝试添加span.head1 { white-space: nowrap; }到 中，但我猜它不起作用。我不能让我的 IE 复制问题，我的开发人员也不能。

HTML：

CSS：

任何人都可以复制这个问题并提供解决方案，以便我的客户标题标题不会随着屏幕变小而分成两行吗？