Firefox文本對齊中心不能使用等寬字體

由於某些原因，Firefox不能正確對齊等寬字體上的文本（但只有大字體大小）。在Mavericks上測試Firefox 32。Firefox文本對齊中心不能使用等寬字體

請參閱JSFiddle here。有任何想法嗎？

<div class="courier">The quick fox centered 
</div> 
<div class="arial">The quick fox centered 
</div> 

body { 
     font-size: 100pt; 
     text-align: center; 
     text-transform: uppercase; 
    } 

div { 
    width: 100%; 
} 

.arial { 
    font-family: Arial 
} 
.courier { 
     font-family: Courier; 
}

來源

2014-09-21 jaybee

它看起來居中我在Firefox的Windows 7和Ubuntu – Devin 2014-09-21 04:24:30

有同樣的問題，最新的Firefox穩定。奇怪的。「居中」一詞居中，「快狐」不是。 [撥弄背景突出顯示]（http://jsfiddle.net/dL44u1s9/） – misterManSam 2014-09-21 06:49:08

是的，我有完全相同的問題。真奇怪。如果你減小字體大小的問題消失了[見JSFiddle這裏]（http://jsfiddle.net/dL44u1s9/8/）我真的不知道發生了什麼@misterManSam – jaybee 2014-09-21 07:14:33

由於每個div的渲染方式不同，因此您會得到不同的中心位置。如果你希望這兩個div都居中，相應地將它們包裝在一個div中並相應地改變樣式。檢查小牛本jsfiddle

#wrapper { 
    width: 90%; 
    margin:0px auto; 
    text-align:center; 
}

來源

2014-09-21 04:20:36 learningloop

在Mozilla中仍然看起來不正確。我附上了JSFiddle的截圖。 Arial div完全居中，但Courier div看起來很亂。 [Image Link]（http://imgur.com/jaaHsbJ）@learningloop – jaybee 2014-09-21 05:37:21

Firefox文本對齊中心不能使用等寬字體

回答

相關問題