Image-Anker funktioniert nicht, Hinzufügen von Display-Block funktioniert nicht

Question

Ich habe eine Seite wie diese http://codepen.io/meek/pen/NNprYb?editors=1000 Im Portfolio-Abschnitt, ich versuche, einen Anker zu den Bildern hinzuzufügen. Aber das Klicken auf sie scheint das neue Fenster nicht auszulösen.

Die html wie folgt aussieht:

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

Ich habe auch versucht:

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

(keine selbstschließenden Tags)

und

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

und keiner von Diese Methoden funktionieren.

Answer 1

Ihr Overlay, .tint:before, verdeckt den anklickbaren Bereich des Tags a. Das Verschieben des a Tags außerhalb des Tags figure sollte klickbar sein. Ich bin mir nicht sicher, wie es das CSS beeinflussen würde.