Firefox从斜线破字而出

Question

为什么Firefox将/（斜线）和-（连字符）中的单词分成几行。

/和的示例-

table {
  width: 100%;
}

<table>
  <tbody>
    <tr>
      <td>
        LoremipsumdolorsitametconsecteturadipisicingelitLaboredistinctionamdoloresmodiamet/etblanditiisarchitectsundolorem/qnullobcaecatnobilibermollitia/sialiquiodiomagncommodi.

      </td>
    </tr>
  </tbody>
</table>

---

没有/和的示例-

table {
  width: 100%;
}

<table>
  <tbody>
    <tr>
      <td>
        LoremipsumdolorsitametconsecteturadipisicingelitLaboredistinctionamdoloresmodiametetblanditiisarchitectsundoloremqnullobcaecatnobilibermollitiasialiquiodiomagncommodi.
      </td>
    </tr>
  </tbody>
</table>

这两个示例在其他浏览器中都可以正常运行，我已经尝试过overflow-wrap但没有成功。

我正在使用Firefox 67.0 (64-bit)。

请在Firefox中打开它。

Answer 1

看起来像是Mozilla正在考虑的，/并且-是空格分隔符。经过细致的研究，我建议转义/并-使用其html等效代码，然后再将其发布到表中。

UPDATE
找到了另一个在mozilla中也可以使用的纯CSS解决方案

table {
  width: 100%;
}

table td { 
    word-break: keep-all; 
}

<table>
  <tbody>
    <tr>
      <td>
        LoremipsumdolorsitametconsecteturadipisicingelitLaboredistinctionamdoloresmodiamet/etblanditiisarchitectsundolorem/qnullobcaecatnobilibermollitia/sialiquiodiomagncommodi.

      </td>
    </tr>
  </tbody>
</table>

这是一个小JS代码段，可以转义/并-转换为等效的html代码。

var str = 'Loremipsumdolorsitametconsectetura-dipisicingelitLaboredistinctionamdol-oresmodiamet/etblanditiisarchitectsundolorem/qnullobcaecatnobilibermollitia/sialiquiodiomagncommodi.';

const escaped = str.replace(/\//g, '/').replace(/-/g, '-');