Bootstrap 4垂直对齐对我来说根本不起作用

Question

这是我直接从Bootstrap文档中复制并粘贴的代码。出于某种原因，当我使用它（有2列）时，第一列中心与第二列的高度垂直对齐。无论父元素的高度如何，都不会改变。我做错什么了吗？我还包括了我要使用的代码。我希望这两列都垂直对齐包含元素的中心。

<div class="container">
  <div class="row align-items-start">
    <div class="col">
      One of three columns
    </div>
    <div class="col">
      One of three columns
    </div>
    <div class="col">
      One of three columns
    </div>
  </div>
  <div class="row align-items-center">
    <div class="col">
      One of three columns
    </div>
    <div class="col">
      One of three columns
    </div>
    <div class="col">
      One of three columns
    </div>
  </div>
  <div class="row align-items-end">
    <div class="col">
      One of three columns
    </div>
    <div class="col">
      One of three columns
    </div>
    <div class="col">
      One of three columns
    </div>
  </div>
</div>


<div class="container-fluid">
  <div class="row align-items-center">
    <div class="col-sm pink"></div>
    <div class="col-sm pink"></div>
  </div>
</div>