html – 为什么我的图片链接的边距可点击？

我正在为一个朋友建立一个网站,他的一部分规范是,图像应该包含以较高分辨率查看图像的链接.我把一个主图像放在一个div里面,但是我不知道为什么我的图片的边距空间是可以点击的.

我假设它与div内的图像有关系？

这是我的小提琴：http://jsfiddle.net/9kSL3/5/

以下是感兴趣的领域：

<div id="home">
<a href="./images/home3.jpg"><img src='http://s17.postimg.org/4glpnzdan/home3.jpg' border='0' alt="home3" /></a>
</div>



#home img{
    width: 60%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    /*border-radius: 15px;
    border: 1px;*/
}

对我来说奇怪的是在这个答案中：Remove space around clickable image的答案是使用margin而不是padding

解决方法

这是因为你有一个img在一个标签内使用display：block,这是一个内联的.

移动宽度：60％,边距：0自动;到带有display：block的标签,并添加宽度：100％到img

示例：http://jsfiddle.net/9kSL3/6/