我怎麼能垂直圖像和文本對齊，中間的div

內。例如：http://jsfiddle.net/S23ut/1/我怎麼能垂直圖像和文本對齊，中間的div

我想形象，是垂直對齊到其容器中的文本。我似乎無法得到這個CSS的權利。任何想法/竅門？

2012-04-23 Ken

我不知道跨瀏覽器兼容，但使用CSS display: table-XXX可能的工作：

#offer_widget .row { 
    display: table-row; 
} 

#offer_widget .row_image { 
    display: table-cell; 
    text-align:center; 
    vertical-align: middle; 
} 
#offer_widget .row_text { 
    display: table-cell; 
    vertical-align: middle; 
}

見this update to your jsFiddle。

來源

2012-04-23 05:39:39 detly

哎除去浮體和給顯示錶屬性住演示在2周嵌套的div http://jsfiddle.net/rohitazad/S23ut/5/

來源

2012-04-23 05:40:22

使用下面的CSS樣式：

display:table 
display:table-cell

例如。

<html> 
<head> 
    <style> 
     #outer{width:100px; height:60px; border:solid 1px #f00;display:table;} 
     #inner{display:table-cell; vertical-align:middle;text-align:center;font-size:16px;} 
    </style> 
</head> 
<body> 
    <div id="outer"> 
     <div id="inner">test</div> 
    </div> 
</body> 
</html>

來源

2012-04-23 05:47:39 seanbun

我怎麼能垂直圖像和文本對齊，中間的div

回答

相關問題