css - 垂直对齐 div 中的文本

Question

我想将第二列中的文本垂直居中。我已经尝试了所有常用的建议：my-auto、align-items-center 等，但我似乎无法做到正确。

谁能指出我正确的方向？

<div class="row justify-content-center">
        <div class="col-1" style="background-color: #cfdc27">
        </div>
        <div class="col-10 d-flex">
          <div class="my-auto">
            <h4>Title goes here</h4>
            <p class="text-muted">Subtitle goes here.</p>
          </div>
        </div>
      </div>

https://codepen.io/anon/pen/dExRQJ

标签： cssbootstrap-4