HTML表格 - 如何使IE不破坏连字符

Question

我有一些包含日期格式的表格单元格：2009-01-01。 I.E 7似乎在连字符处将这些分为两行。有什么办法可以解决这个问题吗？

Answer 1

您正在寻找white-space property，它可以让您控制空格和换行符如何影响元素的内容。要折叠空格序列，但要阻止换行符，可以使用nowrap值：

.dates {
    white-space: nowrap;
}

<td class="dates">2009-01-01</td>

Answer 2

我确信有一种更好的CSS方式，但旧的方式是不间断：<nobr>...</nobr>但使用不中断将导致无转到下一行。

另一种方法是使用Non-breaking hyphen。这样，您仍然可以进行包装，而不是连字符。

Answer 3

使用此CSS：

.nowrap {
    white-space: nowrap;
}

包裹您的日期，如：<span class="nowrap">2009-01-01</span>。

编辑：此解决方案优于其他解决方案的优势在于它可以让您更精确地控制应该或不应该包装的内容。您的单元格仍然可以在跨度外包裹空格和其他连字符。

Answer 4

我已经尝试了所有这些建议。没有用。在另一个Stack Overflow页面上找到了解决方案：No line-break after a hyphen。您可以将代码用于非破坏连字符‑。

Answer 5

增加TD的大小，这不会成为问题

Answer 6

这是 NOT 回答问题的正确方法，但我就是这样做的：

<td>Hello&nbsp;-&nbsp;World</td>

我更喜欢这种方法，因为您不需要添加<style>或类属性。此外，它使文本一个字符串，以便它不能被浏览器换行。

就像我说的那样，大多数人都不同意，但我认为这是一个实用的解决方案比标准解决方案更好的地方。

Answer 7

我的愚蠢错误是我忘了在我用垫子设置间距之间放置空格。我喜欢 <span>Bla 1</span><span>Bla 2</span><span>Bla 4</span>
并没有像我想象的那样突破界限。所以现在我有：
<span>Bla 1</span> <span>Bla 2</span> <span>Bla 4</span>
当然，它的工作原理应该是预期的。

也许我的错误会帮助别人......