Css 如何在bootstrap 4中使组件垂直居中于等高列

我应用了这个问题的解决方案：

但是，我的问题没有得到解决。虽然我应用了以下方法，但我无法实现相同高度和垂直居中：

<div class="cycle-des h-100 justify-content-center">Product Cycle</div>

产品周期

这是我这期的截图：

这是我的

给你

  <div class="container">
      <div class="row">
        <div class="col-md-4 mb-3 pr-md-0">
          <div class="cycle-des h-100 align-items-center justify-content-center">Product Cycle</div>
        </div>
        <div class="col-md-4 mb-3 pr-md-0">
          <div class="row no-gutters h-100">
            <div class="col-4 col-lg-3">
              <div class="cycle-num h-100 align-items-center justify-content-center">01</div>
            </div>
            <div class="col-8 col-lg-9">
              <div class="cycle-des h-100 align-items-center justify-content-center">handloom: 4-7days</div>
            </div>
          </div>
        </div>
        <div class="col-md-4 mb-3 pr-md-0">
          <div class="row no-gutters h-100">
            <div class="col-4 col-lg-3">
              <div class="cycle-num h-100 align-items-center justify-content-center">02</div>
            </div>
            <div class="col-8 col-lg-9">
              <div class="cycle-des h-100 align-items-center justify-content-center">S/S MQ: 50M</div>
            </div>
          </div>
        </div>
        <div class="col-md-4 mb-3 pr-md-0">
          <div class="row no-gutters h-100">
            <div class="col-4 col-lg-3">
              <div class="cycle-num h-100 align-items-center justify-content-center">03</div>
            </div>
            <div class="col-8 col-lg-9">
              <div class="cycle-des h-100 align-items-center justify-content-center">S/S: 25-30days</div>
            </div>
          </div>
        </div>
        <div class="col-md-4 mb-3 pr-md-0">
          <div class="row no-gutters h-100">
            <div class="col-4 col-lg-3">
              <div class="cycle-num h-100 align-items-center justify-content-center">04</div>
            </div>
            <div class="col-8 col-lg-9">
              <div class="cycle-des h-100 align-items-center justify-content-center">Order MQ: 2000M</div>
            </div>
          </div>
        </div>
        <div class="col-md-4 mb-3 pr-md-0">
          <div class="row no-gutters h-100">
            <div class="col-4 col-lg-3">
              <div class="cycle-num h-100 align-items-center justify-content-center">05</div>
            </div>
            <div class="col-8 col-lg-9">
              <div class="cycle-des h-100 align-items-center justify-content-center">Order delivery date: 35-50 days</div>
            </div>
          </div>
        </div>
      </div>
    </div>

    .cycle-num, .cycle-des {
      color: #fff;
      text-align: center;
      padding: 20px 10px;
      display: flex;
    }
    .cycle-num {
      background-color: #666;
    }
    .cycle-des {
      background-color: #333;
    }

产品周期
01
手摇织机：4-7天
02
S/S MQ:50米
03
S/S:25-30天
04
订单MQ:2000M
05
订单交付日期：35-50天
.cycle num、.cycle des{
颜色：#fff；
文本对齐：居中；
填充：20px 10px；
显示器：flex；
}
.循环数{
背景色：#666；
}
.循环des{
背景色：#333；
}

但我相信你可以减少div的数量，并且可以做得更好。只是一个建议，您不必到处使用网格类。只需将其用于布局