防止长于容器的特殊字符导致分词答案

【问题标题】：Prevent special characters longer than container to cause word break防止长于容器的特殊字符导致分词
【发布时间】：2018-06-13 23:22:31
【问题描述】：

如果用户输入一个 URL 或一个包含问号或连字符的长单词，该单词将中断（比其包含 overflow: auto 的容器长）。我可以使用 Unicode 不间断连字符来解决连字符问题，但问号没有类似的东西。

同时具有{}[] 或[][] 或[]{} 也会导致断字

这是我所说的一个例子：http://jsfiddle.net/f53watec/37/

我试图让 div 元素看起来与 section 元素完全一样，而字符串不会与任何特殊字符中断

【问题讨论】：

嗨！ “这是我正在谈论的示例：jsfiddle.net/f53watec/37” SO 的工作方式，您的整个问题（包括任何必要的代码/标记/示例）必须在你的问题，不仅仅是链接。两个原因：人们不应该去场外帮助你；和链接腐烂，使问题及其答案对未来的人们毫无用处。请在问题中添加minimal reproducible example in。更多：How do I ask a good question?

【解决方案1】：

我认为问题是什么？被视为空白。因此，如果您添加：

white-space: pre;

它应该工作。如果您希望其他行中断，则需要在单词周围放置一个例如跨度并将规则仅放在该跨度上。

您还可以在 URL 周围使用 <nobr> 标记。

我认为仅使用 css 不可能将特殊字符视为空格。（如果我错了，请任何人纠正我！）

【讨论】：