对齐项中心，同时保持充分的背景高度(align-items-center while keeping

我有一个行内两列在引导4.如果我尝试使用对齐项中心在该行对齐垂直的内容，或对齐自中心的山坳中，H4为中心，但背景是不是全高。 这里是一个笔https://codepen.io/geo555/pen/PyaLbE

<div class="container">
  <div class="row no-gutters justify-content-center">
    <div class="col-sm-4">
       <img src="https://via.placeholder.com/400X400" class="img-fluid">
    </div>
    <div class="col-sm-4 text-center bg-dark text-white align-self-center">
       <h4>Awesome desk</h4>
    </div>
   </div>
</div>

Answer 1:

让山坳d-flex flex-column ，并使用垂直自动利润率（ my-auto上的标题）...

<div class="container">
    <div class="row no-gutters justify-content-center">
        <div class="col-sm-4">
            <img src="https://via.placeholder.com/400X400" class="img-fluid">
        </div>
        <div class="col-sm-4 border text-center bg-dark text-white d-flex flex-column">
            <h4 class="my-auto">Awesome desk</h4>
        </div>
    </div>
</div>

https://www.codeply.com/go/7nPpNbXHF4

文章来源: align-items-center while keeping the background full height