如何垂直對齊我的圖像和文本

Question

我正在嘗試爲我的文本和圖像做垂直對齊。

看來文本對齊在我的jsfiddle頂部

text here  -- 
       | | 
       -- 

我希望有我的文字像

   -- 
text here  | | 
       -- 

http://jsfiddle.net/wjPxS/

我真的不能改變我圖像漂浮在CSS中。任何人都可以幫助我嗎？非常感謝！

Answer 1

鑑於您知道容器的高度，您只需將line-height設置爲與height相同即可垂直對齊文本。

Demo

.div1 { 
    height: 20px; 
    line-height:20px; 
} 

Answer 2

updated jsFiddle

您需要申請

display: inline-block; 
vertical-align: middle; 

既img和span。在jsfiddle中，我用`div'替換了span。

雖然，這不會讓您將img浮動到右側。