come allineare un'immagine al centro di una pagina in ionico

Question

Voglio allineare un'immagine (logo) al centro (sia orizzontale che verticale) della pagina?

<ion-view hide-nav-bar="true"> 
<ion-content class="backgound-red "> 
<section class = "home-container"> 
     <div class="row icon-row"> 

     <div class="col"> 
        <h1 class="text-white text-center">My Application </h1> 
      <h4 class ="text-white text-center ">version 1.0.0</h4> 
     </div> 
    </div> 

    <div class="row row-center" > 
     <div class="col text-center" > 
      <img alt="Logo" height="100" src="img/logo.png" > 
     </div> 
     </div> 
    <div class="row icon-row"> 

     <div class="col "> 
      <a class="text-white text-center" href="#" onclick="window.open('http://members.000webhost.com/login.php?'); return false;"> 
       <h5 class ="text-white text-center ">access server</h5></a> 
     </div>   
    </div> 
    </section> 
</ion-content> 

il layout che voglio, l'immagine deve essere il centro allinea automaticamente alla schermata di cellulare. (Scheda, telefono)

Answer 1

Prova ad aggiungere il codice CSS, è centrerà l'immagine sia orizzontalmente che verticalmente.

.home-container .row-center img { 
    position:absolute; 
    left: 0; 
    right: 0; 
    margin:0 auto; 
    top:50%; 
    transform:translateY(-50%); 
}