Ionic flexbox не может установить вход по вертикали - PullRequest
0 голосов
/ 09 ноября 2018

Я использовал 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%;
        }
    }

}

1 Ответ

0 голосов
/ 09 ноября 2018

Вы должны установить высоту для элемента контейнера, а не для элемента:

.flex-container {
    height: 33vh;
}
...