字體真棒圖標不是垂直居中

我使用最新的字體真棒圖書館（4.4），它似乎有些圖標不是垂直居中或他們有不同的大小。字體真棒圖標不是垂直居中

Reproduction online

我做了一個變焦在font-size: 14px;列表在這裏：

有什麼我做錯了嗎？

來源

2015-09-07 Alvaro

集線高度的字體。 –

不，他們不會......這就是字形繪製的方式。有些人喜歡小寫字母q - 例如http://jsfiddle.net/6or8h5z0/1/ –

我遇到了同樣的問題。字形容器是平方的，高度取決於圖標的寬度（也像@Paulie_D表示有一些下降）。我發現的唯一方法是手動設置每個位置。 –

.quick-actions i { 
    font-size: 54px; 
    cursor: pointer; 
    color: #999; 
    vertical-align: middle; 
} 
.fa:before { 
    vertical-align: middle; 
} 
.quick-actions{ 
    border:1px solid #ccc; 
    display: inline-block; 
}

這似乎是工作... http://jsfiddle.net/nh1sgw1a/

編輯（我認爲這真的是FA-評論-O的問題）：

.quick-actions i.fa-commenting-o:before{ 
    font-size:50px; 
    /*margin-top:-5px;*/ 
    float:left; 
}

http://jsfiddle.net/nh1sgw1a/2/

來源

2015-09-07 12:24:55

它改善了一點，但仍然不完美。「評論」圖標似乎不適合。 [相當明顯的小圖標]（http://jsfiddle.net/nh1sgw1a/1/）。 – Alvaro

我知道，但對於那個班級添加其他禮儀... http://jsfiddle.net/nh1sgw1a/2/ .quick-actions i.fa-commenting-o：之前{ font-size：50px; margin-top：-5px; float：left; } –

對，我明白了。順便說一下，'line-height：50px;'是沒有必要的。 – Alvaro

像在評論中說，他們沒有畫在中心的水平軸的形狀，這就是爲什麼他們看起來像處於不同的高度。這麼說，我發現將它們更接近我的按鈕/條中間邊緣有用這個CSS規則（更垂直居中，雖然不完美）：

i.fa { 
    vertical-align: middle; 
}

來源

2015-09-07 12:25:17 chimos

字體真棒圖標不是垂直居中

回答

相關問題