bootstrap 4 vertical align by table cell method

index.php

<div class="container">
  <div class="row">
    <div class="col-12 bg-warning p-3 d-table h-100 w-100">
        <span class="display-4 h4 ml-2 text-uppercase text-dark font-weight-bolder d-table-cell align-middle"><?php single_cat_title( __( '', 'textdomain' ) ); ?></span>
        
        <a href="{{ home_url('/kyiv_events') }}"
        class="btn btn-outline-dark btn-sm d-table-cell align-middle"><i class="far fa-circle"></i> Browse All Events</a>
    </div>
  </div>
</div>