title: How To Attach A Card To An Image
body: <p><a href="https://i.stack.imgur.com/mOIQc.jpg" rel="nofollow noreferrer">enter image description here</a>So I am trying to get the last image to fall into the bottom left of the middle image however I can't get my image latch on to the bottom, instead, even if I make a new row, or use clearfix, the image will attach on to images/text/breaks below it.</p>
  
  <pre><code>&lt;img src="https://via.placeholder.com/970x90" class="img-fluid" width="100%"&gt;
  &lt;img src="https://via.placeholder.com/970x400" class="img-fluid" width="100%"&gt;
  &lt;img src="https://via.placeholder.com/970x400" class="img-fluid card-img-overlay mt-auto" width="30%" height="30%"&gt;
  </code></pre>
  
  <p>Also I am trying to get my code all in html and none in css so bootstrap answers are greatly appreciated.</p>