Увеличить высоту Div до высоты вышестоящего Div

Не получается увеличить блок center_header по высоте с родительским top. Flex-basis: 100%, height: 100%; и даже ручная установка высоты в пикселях не помогает. Идея в том, чтобы потом еще один вложенный div с вложенным адресом/телефоном и меню навигации разнести вверх и вниз justify-content: space-between;.

HTML:

<div class="top">
      <div class="logo">
        <img src="img/logo.png" alt="" class="logopic">
        <div style="text-align: center;">Раз - и на матрас!</div>
      </div>
      <div class="row center_header">
        <div class="col_auto left_center_header" style="justify-content: space-between;">
          <div class="row center-align-items top_left_center_header" style="justify-content: space-between;">
            <div class="col_auto row address">
              <img style="display: inline-block; margin-right:5px; margin-left:15px" src="img/address.svg" alt="">
              <div style="color: #000" class="daichai-city" onclick="nc_fav.modal.show( 'set_location' );">Москва</div>
            </div>
            <div class="col_auto phone_top_left_center_header">
              <a href="tel: +78002000600" class="phone">8 800 2000 600</a>
              <br>с 10:00 до 21:00 по МСК
            </div>
          </div>
          <div class="down_left_center_header">
              <ul class="nav">
                <li class="nav__item"><a class="nav__link" href="#">Каталог</a></li>
                <li class="nav__item"><a class="nav__link" href="#">Доставка</a></li>
                <li class="nav__item"><a class="nav__link" href="#">Отзывы</a></li>
                <li class="nav__item"><a class="nav__link" href="#">Контакты</a></li>
              </ul>
          </div>
        </div>
        <div class="right_center_header">
          <div class="row center-align-items up_right_center_header">
            <div class="col_auto sign_reg">
              <img src="img/user.svg" alt="" class="pic_sign"> 
              <a class="sign__link" href="#">Вход</a>
            </div>
            <div class="basket">
              корзина
            </div>
          </div>
          <div class="down_right_center_header">

          </div>
        </div>
      </div>
    </div>

CSS:

.top{
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.logo{
  font-size: 18px;
  font-weight:800;
  display: flex;
  flex-direction: column;
  align-items:center;
  /* max-width: 100%; */
}
.logopic {
  width: 120px;
}
.center_header {
  top: 0;
  bottom: 0;
  flex-basis: 100%;
  height: 100%;
  padding-left: 30px;
  justify-content: space-between;
}