画像のアンカーが機能しない、表示ブロックを追加することができない

Question

私はこのようなページを持っていますhttp://codepen.io/meek/pen/NNprYb?editors=1000 私は画像にアンカーを追加しようとしています。しかし、それらをクリックすると、新しいウィンドウが表示されないようです。私も試してみた

<a href="http://google.com" target="_blank"> 
    <img src="img/portfolio/pomodoro.jpg" /> 
</a> 

：

<a href="http://google.com" target="_blank"> 
    <img src="img/portfolio/pomodoro.jpg"> 
</a> 

（なし自己終了タグ）

と

<a href="http://google.com" target="_blank" style="display:block;"> 
    <img src="img/portfolio/pomodoro.jpg"> 
</a> 

とのどれを

HTMLは次のようになりますこれらのメソッドは機能します。

Answer 1

オーバーレイ、.tint:beforeは、aタグのクリック可能な領域をカバーしています。 aタグをfigureタグの外側に移動すると、クリック可能になります。私はそれがどのようにCSSに影響するか分からない。