<a>元素之间的空格

为什么图片之间有空格？ http://jsfiddle.net/dasmus/6Ltrs9tw/<a>元素之间的空格

CSS

.gallery{ 
width:900px; 
height:640px; 
} 
a{ 
display:inline-block; 
} 

a img{ 
width:200px; 
height:141px; 
}

HTML

<div class="gallery"> 
    <a ><img src="http://1.1.1.1/bmi/alpatriott.ru/works/album/images/smile.jpg"></a> 
    <a ><img src="http://1.1.1.1/bmi/alpatriott.ru/works/album/images/smile.jpg"></a> 
    <a ><img src="http://1.1.1.1/bmi/alpatriott.ru/works/album/images/smile.jpg"></a> 
    <a ><img src="http://1.1.1.1/bmi/alpatriott.ru/works/album/images/smile.jpg"></a> 
</div>

来源

2014-10-05 Mihkel L.

参见：http://stackoverflow.com/questions/19038799/why-is-there-an-unexplainable-gap-between -these-inline-block-div-elements .. http://stackoverflow.com/questions/5078239/how-to-remove-the-space-between-inline-block-elements – 2014-10-05 17:23:55

Thanks http://stackoverflow.com/a/19038859/1690081这是诀窍。（也浮动作品）为什么它会尊重whitespacejesus。 – 2014-10-05 17:36:57

a{ 
    display:inline-block; 
    float:left; /* added */ 
    }

来源

2014-10-05 17:23:10

你不需要两个，使用'inline-block'关闭点就是水平对齐元素。 – jmore009 2014-10-05 17:24:23

因为display: inline-block添加元素之间的额外空间。有黑客来照顾这一点，但如果你想要的元素，你最好只使用float:left。只要确保以添加overflow:hidden的父元素或使用clearfix

JSFIDDLE

来源

2014-10-05 17:23:11 jmore009

谢谢。没有读过w3School.com – 2014-10-05 17:26:18

请不要在w3school上阅读:) – 2014-10-05 17:27:05

不是w3school喜欢制作标准版的人）。你会有什么建议有更好的参考？ – 2014-10-05 17:30:28

<a>元素之间的空格

回答

相关问题