html - 如何在 IE 中的正确位置打断长句

Question

我必须在 div 的段落中显示非常长的句子。对于这种情况，我必须注意几件事。 1. 行不能越界 2. 句子的换行应该发生在适当的地方，比如单词之间的空格。以下 CSS 在 Chrome 中运行良好。代码来自https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/稍作修改。

 .handle-long-sentence{
     white-space: normal;

     overflow-wrap: break-word;
     word-wrap: break-word;

     -ms-word-break: break-all;
     word-break: break-all;
     word-break: break-word;

    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;

  }

在 IE11 中，段落显示为齐平，并在多处出现随机断字。

谢谢

Answer 1

我终于找到了适用于所有三种主要浏览器的 CSS

.handle-long-sentence{
   white-space:normal;
   white-space: -moz-pre-wrap; /* Mozilla */ 
   -ms-hyphens: auto;
   -moz-hyphens: auto;
   -webkit-hyphens: auto;
   -o-hyphens: auto;
   hyphens: auto;
}

每当一个单词被打断时，这就会在 IE 中添加一个连字符。在 Chrome 和 Firefox 中，没有单词会被打断，单词之间的空格用于自动换行。