title: Ionic: How to center a div?
body: <p><strong>THE SITUATION:</strong></p>
  
  <p>I am making an app using <a href="http://ionicframework.com/docs/">Ionic framework</a>. In one page i need to display an image. This image has to be horizontally centered.</p>
  
  <p><strong>ATTEMPT 1:</strong></p>
  
  <p>Following the <a href="http://ionicframework.com/docs/components/#grid-offset">documentation</a> i have divided one row into three equal columns and put the image in the second one.</p>
  
  <pre><code> &lt;div class="row"&gt;
      &lt;div class="col col-33"&gt;&lt;/div&gt;
      &lt;div class="col col-33"&gt;
          &lt;img src="{{ data.logo }}" alt=""&gt;
      &lt;/div&gt;
      &lt;div class="col col-33"&gt;&lt;/div&gt;
   &lt;/div&gt;
  </code></pre>
  
  <p>But unfortunately the image is far to be centered. Tend to stay in the left half of the screen.</p>
  
  <p><strong>ATTEMPT 2:</strong></p>
  
  <p>Trying with some old css tricks.</p>
  
  <pre><code>&lt;div style="margin: 0 auto;"&gt;
      &lt;img src=" {{ data.logo }} " alt="" &gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>But again i am not getting the desired result.</p>
  
  <p><strong>THE QUESTION:</strong></p>
  
  <p>How can i center a div in Ionic framework?</p>