內嵌塊添加底部空間

Question

我有我的<a>鏈接之一設置爲inline-block並且有一些空間添加到包含div的底部。我不知道如何擺脫這一點，並想知道如果有人可以幫助。

這裏是一個小提琴：http://jsfiddle.net/RQ69r/1/

在此先感謝。

Answer 1

您可以修復，添加以下樣式到內嵌塊元素：

vertical-align: middle; 

Demo

Answer 2

爲什麼不把它改成display: block;？

檢查更新小提琴： http://jsfiddle.net/RQ69r/3/

如果您想了解更多<a>元素彼此相鄰（水平），你可以使用list-items和/或float:left;

Answer 3

這是inline-block元素的默認行爲。設置父DIV font-size: 0px;

DEMO http://jsfiddle.net/RQ69r/7/

.row_20 { 
    width: 20%; 
    font-size: 0px; 
} 

，並設置孩子的正確的字體大小element

.header .logo { 
    font-size: 13px; <-- set font size 
    height: 45px; 
    width: 100%; 
    display: inline-block; 
    background: blue; 
}