垂直居中錨標籤到右浮動元素

Question

我一直在尋找一種方法來根據跨度標記垂直居中定位標記，它們都被包裹在div標記中。

我的HTML

<div id="project_list"> 
    <div class="title"> 
    <a href="/projects/example/">Example Project</a> 
    <span class="show_details">Show Details</span> 
    <div style="clear: both"></div> 
    </div> 
</div> 

我的CSS

div#project_list { 
    border: 2px solid #000000; 
} 

div#project_list div.title { 
    background: grey; 
    padding : 10px; 
} 

div#project_list div.title a { 
    font-size: 1.231rem; 
} 

div#project_list span.show_details { 
    background: orange; 
    float  : right; 
    padding : 13px 5px; 
} 

我也曾經創造的jsfiddle here，所以你可以看到我在談論。

謝謝大家，因爲我一直在爲如何在幾天內完成這項工作而絞盡腦汁。

Answer 1

您可以設置行高度按鈕的高度匹配：

a { line-height:46px; }

注：我只是用a但你可能會想添加一個類，所以風格不應用到所有錨標籤。

http://jsfiddle.net/GxqTh/2/

Answer 2

@ OpenNoxdiv-嘗試添加填充到您的一個標籤; 20px似乎很適合我。 - 見下面

#project_list div.title a { 

padding-top：20px; }