Center a vertically ionic ion-content v4

#1

Hello everyone, someone knows how I can put it in the middle of the screen and see it in the middle of the screen in all the mobile devices the margin-top is to be downloaded using px or% but in screens it looks different

my html:

<ion-content color="favorite" padding>
  <div class="div_general">
    <img src="assets/imgs/logo.png" width="55%">
    <div class="div_mayor">
      <ion-list no-lines>
        <ion-item>
          <ion-label><ion-icon name="person"></ion-icon></ion-label>
          <ion-input type="text"></ion-input>
        </ion-item>
        <ion-item>
            <ion-label><ion-icon name="key"></ion-icon></ion-label>
          <ion-input type="password"></ion-input>
        </ion-item>
        <ion-button color="favorite" class="button" expand="block">
          INGRESAR
        </ion-button>
      </ion-list>
    </div>
  </div>
</ion-content>

my css:

ion-content {
    width: 100% auto !important;
}
img{
    display:block;
    margin:auto;
    }

.div_mayor{
    margin-bottom: 20px;
    width:auto;
    margin:auto;
    height: 200px auto;
    background: white;
    padding: 30px;
    border-radius: 10px;
    ion-button {
        height: 45px;
        margin-top: 10px !important;
    }
    ion-item{
        padding: 3px;
        margin-top: 10px !important;        
        border-radius: 10px;
        border-style: solid;
        border-color: #3f51b5;        
    }  
}


#2

See “Flex Container Properties” in the documentation https://beta.ionicframework.com/docs/layout/css-utilities