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文本对齐中心不能使用等宽字体

回答

相关问题