Firefox单词在随机点打破短语 [英] Firefox word-break breaks short words at random points
问题描述
我 break-word
一个容器,以便极长的字不会溢出。虽然Chrome和Safari处理这真的很好,似乎Firefox和IE喜欢打破字随机 - 甚至短话,在最可笑的点。请参阅下面的屏幕截图:
I'm break-word
ing a container so that extremely long words won't overflow. While Chrome and Safari deal with this really well, it seems that Firefox and IE like to break words randomly - even short words, at the most ridiculous points. See the screenshots below:
这里是我用来防止破解的代码:
Here is the code I'm using to prevent break the words:
.break-word {
-ms-word-break: break-all;
word-break: break-all;
word-break: break-word;
-webkit-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;
}
这是我用于容器和文本的CSS:
This is the the CSS I'm using for the container and the text:
.wrap {
position: relative;
text-align: center;
margin: 40px auto 20px;
padding: 50px;
border: 4px double #f7f7f7;
display: block;
}
.quote-text {
font-size: 40px;
line-height: 50px;
font-weight: 400;
}
HTML
<div class="wrap break-word">
<div class="row-fluid quotation-marks">“”</div>
<span class="quote-text">
Having a partner definitely allows you to take more risks.
</span>
<span class="author">Arianna Huffington</span>
</div>
为什么会发生这种情况?任何线索如何我可以得到的话在所有浏览器正常断裂? Firefox绝对是一个优先级。
Why is this happening? Any clues on how I could get the words to break normally across all browsers? Firefox is definitely a priority.
提前感谢!
推荐答案
CSS参数。尝试此操作。
You're doubling up on CSS parameters. Try this..
.break-word {
-ms-word-break: break-all;
-ms-word-wrap: break-all;
-webkit-word-break: break-word;
-webkit-word-wrap: break-word;
word-break: break-word;
word-wrap: break-word;
-webkit-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;
}
这篇关于Firefox单词在随机点打破短语的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!