<a> 包裹 <img> 产生 4px 间隙

Question

http://zjy.name/lab/ife/t1/index.html
上面页面中右上角的GitHub图标下方存在4px的间隙，通过DevelopmentTool可以看到是由于a标签比img标签高出4px产生的（img34pxa38px），已经知道这个问题可以通过line-height:0来解决，但自己写demo想要复现这个问题的时候却怎么也出不来：http://zjy.name/lab/ife/t1/4px-demo.html
求大神详解其中奥妙。