个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
IE 没有正确响应 nowrap CSS 属性。
问题:如何在 IE 中使它工作，使其呈现为 Chrome 的呈现结果。
http://jsfiddle.net/subsari/tmz0t0z2/3/
<body>
<table>
<tr>
<th>Header 1</th>
<th>Header 2</th>
<th>Header 3</th>
</tr>
<tr>
<td class="long_string">Data 1 with long text</td>
<td>Data 2</td>
<td>Data 3</td>
</tr>
</table>
th {
border: 1px solid red;
}
td {
border: 1px solid black;
}
.long_string {
white-space: normal;
white-space: nowrap;
max-width: 100px;
color: #FFA500;
}
如何让 IE 像 Chrome 一样渲染表格？最干净的解决方案？
提前感谢您的帮助!
最佳答案
问题不在于 white-space: nowrap(文本停留在一行)，而在于 max-width 设置。虽然一般都是supported即使是 IE 7，IE 7 在应用于表格单元格时似乎也存在问题，以及其他一些奇怪的问题。 (我的观察是基于在不同的仿真模式下使用 IE 11，而不是在旧版本的 IE 上实际测试。)
如果支持 IE 7(及更早版本)足够重要，您可以考虑在内容上设置特定宽度而不是最大宽度。 To 然后需要将长字符串包装在容器中并在其上而不是在表格单元格上设置宽度。您还需要在该容器上设置 overflow: hidden(否则溢出的内容仍然会使单元格变宽)。示例:
th {
border: 1px solid red;
}
td {
border: 1px solid black;
}
.long_string {
white-space: nowrap;
width: 100px;
overflow: hidden;
color: #FFA500;
}<table>
<tr>
<th>Header 1</th>
<th>Header 2</th>
<th>Header 3</th>
</tr>
<tr>
<td><div class="long_string">Data 1 with long text</div></td>
<td>Data 2</td>
<td>Data 3</td>
</tr>
</table>关于CSS: IE: white-space: nowrap 不工作，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27748826/
25
4
0
我现在是我的 div 的宽度，但我不知道我的 child button 和 ins 标签的高度。ins标签有nowrap。 我想用 ins 标签在一行中显示 button。 div { bor
我有一个 KnockoutJS 模板，它创建一个 input[type=text] 和一个 select 彼此相邻，没有 中间。然而，它在 white-space: nowrap; 之间设置了一个换行
所以我有这些 DIV，我已安排它们在父级内部向左向右滑动。 请参阅以下 JSFiddle 以查看设计: http://jsfiddle.net/StevP/C9WL7/ 您可以看到，通过将第一个子 D
在此图像中，最后一个框中有额外的空间，如红色箭头所示。如何解决？ 最后一个短语周围有 white-space: nowrap。 JSFiddle .outer { text-align: cent
我想制作一些带有分隔线的自定义标题。我将最大宽度文本设置为 40%，行分隔符显示在文本之后。主要想法是，如果文本少于 40%，则行从文本结束处开始，但如果文本大于 40%，则换行。 不幸的是，如果我不
我正在尝试构建一个切换开关，单击它可以添加或删除空格换行。 必须包裹的div不能有ID，所以需要通过它的类来识别。在本例中为“文本”。在整个页面上，该类仅使用一次。 我构建了这个，但它不起作用。我哪里
我正在尝试使用 CSS 进行以下设计: 想法是让它在全 Angular 容器中水平滚动。 我在包装器中添加了 white-space: nowrap，但由于文本太长，它会从容器中消失。这是问题的屏幕截
使用 nowrap 和列表项会出现一些奇怪的行为。如何让填充在 chrome 中正确应用于“Testing 123”li？ (测试 123 中的“3”超出了定义的宽度并侵占了填充)。 基本上我想要实现
不使用 table 可以将标签放在每个文本框上方吗？我的问题是当我尝试在“NoWrap”中放置“新行”时。 基本上我得到了一个数组的数组，有“名称”和“值”，值将由用户更改，所以第一组元素将并排显示，
我承认，当我不想让单词间断时(例如表格标题)，我有在单词之间使用 的习惯。 我真的应该使用 white-space:nowrap 来设置我的元素样式吗？如果我唯一想做的就是避免换行，这两者有什么优
如果我有几个输入( radio 或选项)后跟它们的标签，都在同一行。我是如何做到的，这样它就不会在 radio 后断线，而是在标签后如果需要断线。 First radio Second radio T
在这种情况下: Some Text 我想在必要时在我的文本上换行，但我不希望我的跨度换行，我希望它始终坚持文本的一部分。我该怎么做？ 谢谢， 最佳答案 我如何通过将一
有没有办法避免 div 的换行当内容不仅仅是文本时的内容，例如几个按钮？ 最佳答案 white-space:nowrap; 应该可以解决问题。 #foo { white-space:nowrap;
这是我的代码中不起作用的部分: .copyright { display: flex; flex-wrap: nowrap; /* This is not working */ col
我想让标题包含 Logo 和菜单。 我做了一行和两列。我使用了 Bootstrap 类。当我将窗口大小调整为较小时，菜单会在 Logo 下跳转(看我的图片)。在屏幕宽度较小且菜单在 Logo 下跳转的
我有大量表格数据，其中最左边的列需要始终显示，并且每一行只占一行 - 这可以通过 CSS 指令 white-space: nowrap 来实现>. 我选择了DataTables jQuery plug
我有一个应该内联显示的链接列表。问题是我不希望文本在链接中间换行。如果它需要换行，它应该只在 链接之间进行换行。 因此，我已将 white-space:nowrap; 属性添加到我的链接中。但是生成的
我有一个设置 word-wrap:break-word 的问题。结果让这个div显示了scroll-x。但问题是 blockquote 元素不再是 break-word 的样式，它正在向正确的方向堆叠
这是 JSFIDDLE我想要制作 img 标签:margin-right:1px;但是当我设置空白:nowrap;我不能那样做。我该怎么办？？ 最佳答案 试试这个 http://jsfiddle.ne
我正在使用内部有 ul 列表的自定义滚动条。当 ul 列表或 li 内容扩展时，滚动条也会扩展。 我在主 div 中使用了 white-space:nowrap 以便 ul 宽度得到扩展，但它仅在 c
我是一名优秀的程序员,十分优秀！