CSS 属性 "word-break: break-all"无法正常使用 Chrome 中的特定字符

Question

我正在使用“word-break: break-all”在任何字符之间插入分隔符。
但是，在 Chrome 中，它无法正常处理特定字符(例如冒号、分号、逗号)，如下所示。
(我的代码笔在这里:https://codepen.io/yukito/pen/wobZJq)

源代码:

<style>
  .test {
    width: 300px;
    word-break: break-all;

    /* cosmetic */
    background-color: red;
    margin-bottom: 5px;
  }
</style>

<div class="test">
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
</div>

<div class="test">
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
</div>

在 FireFox 和 Safari 中，它按预期工作。

我的问题:
.这是一个错误吗？还是规范？
.如何在 Chrome 中的连续分号之间换行？

谢谢。

更新:

"break-word"像这支笔一样考虑单词边界来换行:https://codepen.io/yukito/pen/xRNopJ
我真的很想在不考虑单词边界的情况下在任何字符之间插入分隔符。

Answer 1

使用 break-word 属性代替 break-all。

看看下面的片段:

<style>
  .test {
    width: 300px;
    word-break: break-word;
  
    /* cosmetic */
    background-color: red;
    margin-bottom: 5px;
  }
</style>

<div class="test">
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
</div>

<div class="test">
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
</div>

希望这对您有所帮助!