我希望防止在连字符之后出现换行符-在与所有浏览器兼容的情况下。
例子:
我有这个文本:3-3/8"在HTML中是这样的:3-3/8”
问题是，在接近一行的末尾，由于连字符，它会中断并换行到下一行，而不是将其视为一个完整的单词……
3-
3/8"
我已经尝试插入“零宽度无间断字符”，运气不好……
3-3/8”
我在Safari中看到了这一点，并认为在所有浏览器中都是一样的。
下面是我的文档类型和字符编码…
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
有什么方法可以防止这些断行后连字符?我不需要任何解决方案，适用于整个页面…只是一些我可以在需要时插入的东西，比如“零宽度无中断字符”，除了一个有效的字符。
这是一个演示。只要使框架变窄，直到在连字符处断线。
http://jsfiddle.net/RagKH/
IE8/9使CanSpice回答中提到的不间断连字符比典型的连字符长。它是连字符的长度，而不是典型的连字符。这种显示上的差异让我无法接受。
由于我不能使用Deb指定的CSS答案，我转而选择使用无中断标记。
<nobr>e-mail</nobr>
此外，我还发现了导致IE8/9在连字符上出错的特定场景。
字符串包含由不间断空格分隔的单词-
宽度有限
包含破折号
IE渲染成这样。
下面的代码重现了上面所示的问题。我不得不使用一个元标签来强制渲染到IE9，因为IE10已经修复了这个问题。没有小提琴，因为它不支持元标签。
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=9" />
<meta charset="utf-8"/>
<style>
body { padding: 20px; }
div { width: 300px; border: 1px solid gray; }
</style>
</head>
<body>
<div>
<p>If there is a - and words are separated by the whitespace code &nbsp; then IE will wrap on the dash.</p>
</div>
</body>
</html>
