在IE,EDGE和Firefox上打破单词无法正常工作

时间:2017-03-16 12:13:19

标签: css internet-explorer microsoft-edge word-break

word-break:边缘不支持break-word,即firefox。 我需要css打破这个词如果空间存在那个空间的中断但是如果空间不存在则直接打破这个词(在chrome或safari中检查小提琴)。  作为MS边缘,IE和Firefox不支持break-word,我不得不使用break-all,但即使句子中存在空格,它也会在中间打破单词。

我可以在这里使用任何CSS吗

这是文本在不同的浏览器上尝试它的小提琴,你将得到我正在获得的问题

https://jsfiddle.net/emx9bL3y/7/

@supports (-ms-ime-align:auto) {
.white-space-pre-wrap{
word-wrap:break-word!important;
word-break:break-all!important;
display:inline-block; 
}
 }

由于

解决方案 Breaking words using CSS 说明标签应该有一个固定的宽度,但在这种情况下,标签的宽度会有所不同,它可以是200px到屏幕的宽度。因此,如果屏幕尺寸较大,标签的宽度将更大或相反。

1 个答案:

答案 0 :(得分:0)

请检查此代码,它正在运行。

.word-breck {
    width: 100%;
    border: solid 1px #ccc;
    word-wrap: break-word;
}
<div class="word-breck">    <p>Itisalongestablishedfactthatareaderwillbedistractedbythereadablecontentofapagewhenlookingatitslayout.ThepointofusingLoremIpsumisthatithasamore-or-lessnormal.</p>
</div>