在Firefox 52

Question

我查看了几个问题和论坛，但一直无法找到答案。我看到this post，但它的解决方案对我不起作用。

我可以确认在Windows和Mac Firefox上都出现了这个问题。

div {
  width: 200px;
  padding: 0 15px;
  margin: 0 auto;
}
p {
  font-size: 16px;
  -ms-word-break: break-all;
  word-break: break-all;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  hyphens: auto;
}

<div>
  <p lang="en">Better Life Expands Commitment to the Environment
</div>

对我而言，在Chrome中，将“承诺”一词改为两行“承诺”，并带有连字符。 Firefox将这个词分为“Commitme”和“nt”，但未能输入连字符。

我尝试了所有小写，各种尺寸，插入­并使用手册，但似乎没有任何效果。我是否错过了可以解决问题的方法？

Answer 1

只需删除word-break: break-all; - 在Firefox中运行：

＆＃13;

＆＃13;

div {
  width: 200px;
  padding: 0 15px;
  margin: 0 auto;
}

p {
  font-size: 16px;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  hyphens: auto;
}

＆＃13;

<div>
  <p lang="en">Better Life Expands Commitment to the Environment
</div>

＆＃13;

＆＃13;

＆＃13;

这是结果的截图（Firefox Mac）：