title: How do I align multiple elements inside a column?
body: <p>I've got two objects inside a column (a paragraph and an image). I need the image at the bottom and the paragraph at the top. Sadly I can't find a bootstrap class that solves this problem. I thought "align-items-between" would do the job but it doesn't. "align-self-end" as a class for the image doesn't work either.</p>
  
  <pre><code>&lt;div class="container"&gt;
      &lt;h1 class="display-3 text-center mb-5"&gt;
          Lorem, ipsum dolor sit amet consectetur adipisicing elit.
      &lt;/h1&gt;
      &lt;div class="row"&gt;
          &lt;div class="col-md-6"&gt;
              &lt;!-- I need this paragraph to stay at the top --&gt;
              &lt;p class="text-muted text-center"&gt;
                  Lorem ipsum dolor sit amet consectetur adipisicing elit. Officiis laudantium ducimus veritatis aliquam voluptas, maiores error inventore facere minus rem.
              &lt;/p&gt;
              &lt;!-- I need this image to be at the bottom of the container --&gt;
              &lt;img src="imgs/abc.svg" class="img-fluid" alt="" /&gt;
          &lt;/div&gt;
          &lt;div class="col-md-6"&gt;
              &lt;!-- Other stuff--&gt;
          &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/WwBpA.png" rel="nofollow noreferrer">Here is an image of what I want</a></p>