title: align-items-center while keeping the background full height
body: <p>I have two columns inside a row in Bootstrap 4.
  If I try to align vertically the content using align-items-center on the row, or align-self-center on the col, the h4 is centered but the background is not full height.
  Here is a pen
  <a href="https://codepen.io/geo555/pen/PyaLbE" rel="nofollow noreferrer">https://codepen.io/geo555/pen/PyaLbE</a></p>
  
  <pre><code>&lt;div class="container"&gt;
    &lt;div class="row no-gutters justify-content-center"&gt;
      &lt;div class="col-sm-4"&gt;
         &lt;img src="https://via.placeholder.com/400X400" class="img-fluid"&gt;
      &lt;/div&gt;
      &lt;div class="col-sm-4 text-center bg-dark text-white align-self-center"&gt;
         &lt;h4&gt;Awesome desk&lt;/h4&gt;
      &lt;/div&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>