如何對齊兩個不同的字體大小彼此相鄰？

Question

如何將兩個不同大小的字體彼此相鄰，以便較小的文本以較大的文本垂直居中？

HTML：

<div id="parent"> 
    <span id="first">first</span> 
    <span id="second">second</span> 
</div> 

CSS：

#first { 
    font-size: 200%; 
} 

#second { 
    font-size: 100%; 
} 

的jsfiddle：http://jsfiddle.net/BmbWr/

Answer 1

可以使用vertical-align: middle財產

http://jsfiddle.net/BmbWr/1/

Answer 2

使用行高css屬性。同時設置第一個和第二個線條高度。

Answer 3

你可以這樣說：

http://jsfiddle.net/BmbWr/5/

我增加了一個進一步的例子。

Answer 4

這工作得很好

#first { 
    font-size: 200%; 

}

#second { 
    font-size: 100%; 
    vertical-align:top; 
    line-height:38px; 
}