“内部div”添加了3个像素的底部填充

Question

I have a containing an <a> containing an <img> .

All elements are styles with border,padding,margin set to 0.

The size of the image is the size of the div, as shown in firebug.

Firebug shows the a link does not extend to the whole size of the img or div. Instead it occupies some space at the bottom, and extended 3 pixels below the div. How do I get rid of them? The a tag has text-decoration: none;

Thanks.

Answer 1

mention display:block in the image style

img{
    display:block;
}

updated jsFiddle File