div 链接仅覆盖 div 的一半

Question

我正在尝试根据此处的代码创建一个创建CSS翻转动画： http://davidwalsh.name/css-flip 但我也想使翻转背面的整个div成为一个链接，我在@thepeer的答案中找到了这里：https：//stackoverflow.com/a/3494108/1818828*/

我把它们放在这个jsfiddle中：http://jsfiddle.net/gmdavis62/PB7j8/14/（注意到目前为止仅针对webkit测试/设计）

.link{    /*Important:*/
    height:160px;
    width:160px;
    position:relative;
}
.back a span{
  position:absolute; 
  width:100%;
  height:100%;
  top:0;
  left: 0px;
  z-index: 1;
}

我的问题是在另一侧（将鼠标悬停在图像上）链接仅覆盖div 的右半部分。我尝试调整宽度和左侧属性，但没有效果。我还尝试将空跨度和链接移动到其余内容之外，没有更改。

我的div有一个CSS红色轮廓，所以我可以看到它们在哪里，除了.link偏移之外，它不能解释链接被关闭。这是怎么回事？

Answer 1

h4 标题具有默认的边距顶部。将其设置为 0，您就没问题了。小提琴：http://jsfiddle.net/PB7j8/20/

h4
{
    margin-top: 0;
}