アンカータグがブートストラップの図形タグで動作しない

Question

Figureをクリックするとリンクにリダイレクトするが、画像をクリックするとアンカータグは機能しない。しかし、ここに「CLICK HERE」のアンカータグが機能します。

<a href="http://google.com"> 
<figure class="effect-ming"> 

<img src="http://example.com/dd.img" alt="Placeholder" /> 

    <figcaption> 
     <p><?php the_title(); ?></p> 
     <a href="<?php the_permalink(); ?>">CLICK HERE</a> 
    </figcaption> 
</figure> 
</a> 

CSS：あなたはあなたのアンカータグを閉じる必要があり

figure.effect-ming figcaption::before { 
    border: 0px solid #fff !important; 
    bottom: 30px; 
    box-shadow: 0 0 0 0px rgba(0, 0, 0, 0) !important; 
    content: ""; 
    left: 30px; 
    opacity: 0; 
    position: absolute; 
    right: 30px; 
    top: 30px; 
    transform: scale3d(1.4, 1.4, 1); 
    transition: opacity 0.35s ease 0s, transform 0.35s ease 0s; 
} 

Answer 1

：

<a href="http://google.com"> 
    <img src="http://example.com/dd.img" alt="Placeholder" /> 
</a> 

<figure class="effect-ming"> 
    <figcaption> 
     <p><?php the_title(); ?></p> 
     <a href="<?php the_permalink(); ?>">CLICK HERE</a> 
    </figcaption> 
</figure> 

私はこれが良いだろうと思います。入れ子が正しくないため、figureタグを移動しました。画像を図の中に入れたい場合は、次のようにします。

<figure class="effect-ming"> 


    <a href="http://google.com"> 
     <img src="http://example.com/dd.img" alt="Placeholder" /> 
    </a> 

    <figcaption> 
     <p><?php the_title(); ?></p> 
     <a href="<?php the_permalink(); ?>">CLICK HERE</a> 
    </figcaption> 
</figure>