title: how to align a image to the center of a page in ionic
body: <p>I want to align a image (logo)to the center (both horizontal and vertical)of the page ? </p>
  
  <pre><code>&lt;ion-view hide-nav-bar="true"&gt;
  &lt;ion-content class="backgound-red "&gt;
  &lt;section class = "home-container"&gt;
        &lt;div class="row icon-row"&gt;
  
          &lt;div class="col"&gt;
                      &lt;h1 class="text-white text-center"&gt;My Application &lt;/h1&gt;
            &lt;h4 class ="text-white text-center "&gt;version 1.0.0&lt;/h4&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div class="row row-center" &gt;
          &lt;div class="col text-center" &gt;
              &lt;img alt="Logo" height="100" src="img/logo.png" &gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;div class="row icon-row"&gt;
  
          &lt;div class="col "&gt;
              &lt;a class="text-white text-center" href="#" onclick="window.open('http://members.000webhost.com/login.php?'); return false;"&gt;
                &lt;h5 class ="text-white text-center "&gt;access server&lt;/h5&gt;&lt;/a&gt;
          &lt;/div&gt;        
      &lt;/div&gt;
      &lt;/section&gt;
  &lt;/ion-content&gt;
  </code></pre>
  
  <p></p>
  
  <p>the layout that I want, The Image should be align center automatically to the mobile screen.(tab, phone)</p>
  
  <p><a href="https://i.stack.imgur.com/oxOSK.png" rel="noreferrer"><img src="https://i.stack.imgur.com/oxOSK.png" alt="Layout"></a></p>