L84*_*L84 5 css firefox hyphenation css-hyphens
我试图使用CSS连字符.它们在IE 11和Safari中工作,但在Firefox中无法正常工作,我不确定为什么.这是一个例子:
.container{
width: 16.6667%;
background:#ccc;
}
h3{
font-size: 0.95rem;
font-weight: 600;
-moz-hyphens: auto;
-webkit-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
}Run Code Online (Sandbox Code Playgroud)
<div class="container">
<h3>DIAGNOSEVERFAHREN</h3>
</div>Run Code Online (Sandbox Code Playgroud)
当您在Firefox中运行代码段时,该字DIAGNOSEVERFAHREN溢出容器并且不会中断.在Safari和IE中,它像我期望的那样打破.为什么这不适用于Firefox?
编辑
正如萨芬Tanalin的注意回答一个必须包括lang属性为连字符才能正常工作.我有这个作为我的<html>标签:
<html class="no-js" lang="de">
Run Code Online (Sandbox Code Playgroud)
确保元素或其某些父元素具有适当的lang属性.CSS连字符的工作至关重要.
通常,至少该HTML元素应具有以下属性:
<html lang="en">
Run Code Online (Sandbox Code Playgroud)
对于大写字符,请在HTML中使用CSS而不是硬编码的大写字母:
.example {text-transform: uppercase; }
Run Code Online (Sandbox Code Playgroud)
由于Firefox 38中修复了错误1105644,因此在Firefox 37及更早版本中,大写的德语文本没有连字符.
出于某种奇怪的原因,这似乎是因为这个词是大写字母.我认为它与Firefox有关,在搜索连字词典时并不认为它是一个单词.
我找不到任何关于它的错误报告,但@MaratTanalin认为它已在Firefox v38中得到修复.
p {
width: 55px;
border: 1px solid black;
-moz-hyphens: auto;
hyphens: auto;
}Run Code Online (Sandbox Code Playgroud)
<p lang="en" class="auto">DIAGNOSEVERFAHREN</p>
<p lang="en" class="auto">diagnoseverfahren</p>Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
8189 次 |
| 最近记录: |