Bootstrap 4 bootstrap4:flex:align资源中心不工作

我希望div中的span项在flex容器中垂直居中。我正在使用bootstrap4

使用

对齐资源中心

和

对齐资源中心

。看起来

justify content center

工作正常，而

align content center

工作不正常

<div class="col-12">
        <div class="d-flex  align-content-center justify-content-center p-2">
        <div class="p-2">
            <span>Warm Weather Shutdown</span>
        </div>
        <div  class="p-2">
            <input type="checkbox">
        </div>
    </div>
</div>  

温暖天气停机

你怎么能做到这一点

---

与

align content center

相比，

align items center

更适合我

<div class="col-12">
        <div class="d-flex  align-items-center justify-content-center p-2">
        <div class="p-2">
            <span>Warm Weather Shutdown</span>
        </div>
        <div  class="p-2">
            <input type="checkbox">
        </div>
    </div>
</div> 

温暖天气停机