html - 在图像链接上获得一些空间

Question

我在标签 a 上有一些空格

<div id="language">
    <a href="#"><img src="http://s23.postimg.org/xbv9ppqhj/language1.png" border="0" /></a>
    <a href="#"><img src="http://s23.postimg.org/q9xc3imvr/language2.png" border="0" /></a>
    <a href="#">lol</a>
</div>

#language a
{
    padding: 0 2px;
    height:21px;
}
#language a img
{   
    line-height:0;
}

http://jsfiddle.net/yokosatan/zcw7u/

我如何摆脱空间？

编辑：找到了类似的问题并尝试添加

vertical-align:middle;

这是工作，但空间是怎么来的？我尝试行高但它不起作用

最近更新

http://jsfiddle.net/yokosatan/zcw7u/1/

Answer 1

您正在为您的 a 标签提供填充值，因此它有一个空格，即使您删除此填充值，您也可以看到一些空间。为此，您可以float:left;为您的 a 标签指定样式。

#language a
{
    paddi/ng: 0 2px;
    height:21px;
    float: left;
}

演示

Answer 2

另一种方法......如果你想让它更接近彼此......

#language a
{
    padding: 0 2px;
    height:21px;
    margin-left:-6px;
}

http://jsfiddle.net/yokosatan/zcw7u/1/