使用自动换行：对两个连续的长词进行断词答案

【问题标题】：Using word-wrap: break-word on two consecutive long words使用自动换行：对两个连续的长词进行断词
【发布时间】：2016-02-05 20:54:31
【问题描述】：

当使用 word-wrap: break-word 对具有两个连续长词的 div 进行分词时，被分断的第二个词从新行开始，如下所示：

IAmALongW
ord
IAmAlsoAL
longword

有什么办法可以在css中防止这种情况，得到以下？

IAmALongW
ord IAmAl
soALongwo
rd

不用恢复到断词：当然是全断了。

【问题讨论】：

【解决方案1】：

.container{
  width: 100px;
  display: inline-block;
  border: 1px solid black;
  word-wrap: break-word;
  white-space: pre;
}

<div class="container">
  <p>thisisaverylongword anotherverylongword</p>
</div>

【讨论】：

【解决方案2】：

使用white-space: pre; 应该可以做到，我相信。

【讨论】：

【解决方案3】：

使用

&nbsp;

在单词之间而不是空格可以帮助防止元素在你不想要的地方强制中断。例如，当您不想在一行中单独留下一个小词时，这会有所帮助。

【讨论】：