title: How to make Bootstrap 4 Image Overlay card entirely clickable?
body: <p>I'm using the Bootstrap 4 card element to create an image grid, with headings overlaid onto each one, but can only seem to link up the text, not the image itself.</p>
  
  <p>I've tried using the stretched link method and it doesn't seem to work. I've also tried putting the whole card in an anchor tag and that also doesn't seem to work - where am I going wrong?</p>
  
  <pre><code>&lt;div class="row"&gt;
    &lt;div class="card text-white col-md-4 p-3 border-0"&gt;
      &lt;img alt="Card image" class="card-img" src="..." /&gt;
        &lt;div class="card-img-overlay"&gt;
          &lt;a href="..." class="stretched-link"&gt;
            &lt;h2 class="card-title"&gt;Title here&lt;/h2&gt;
          &lt;/a&gt;
        &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I would have thought the link would stretch to the whole card as i've seen on the Bootstrap website, but it just doesn't - any help would greatly be appreciated!</p>