Ionic flexbox не может установить вертикальный ввод

Я использовал гибкий бокс, чтобы установить кнопку посередине страницы. Но что бы я ни пробовал, justify-content: center работает, но align-items: center просто игнорируется.

Вот мой HTML-код:

<ion-content padding class = "login">
  <div class = "flex-container">
      <img src = "assets/imgs/startbuttontext.png" class = "flex-item" 
       style = "height: 33vh;">
  </div>
</ion-content>

А вот мой CSS:

.login {
    background: url(../assets/imgs/background1.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    margin: auto;
    z-index: 2;
    position: relative;


    .flex-container {
        display: flex !important;
        justify-content: center;
        align-items: center !important;

        .flex-item {
            padding:0 10px;
            display: flex;
            align-items: center !important;
            height: 33.3%;
        }
    }

}