title: Same Height Cards in Ionic
body: <p>I'm developing an application using Ionic and on the first page, I'm Trying to use Ionic Grid system to show some cards with an image background. 
  The Problem is that When I visit the page in the size of my own laptop's display everything is fine and cards have same height!</p>
  
  <p><a href="http://i.stack.imgur.com/PXPha.png" rel="nofollow">Size of the Display Screenshot</a></p>
  
  <p>But once I resize the browser window the second card height changes (or Using Chrome's Emulator)
  I want these two to have the same height in any situation. I've tried to fix this but no success.</p>
  
  <p><a href="http://i.stack.imgur.com/ZQg1l.png" rel="nofollow">Half size of the Display Screenshot</a></p>
  
  <p>Here's the Snippet I've made. It's not my full code but it demonstrates the Issue I have.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>angular.module('ionicApp', ['ionic'])
  
  .controller('HomeCtrl', function($scope) {
  
  })</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link href="http://code.ionicframework.com/1.2.4/css/ionic.min.css" rel="stylesheet"/&gt;
  &lt;script src="http://code.ionicframework.com/1.2.4/js/ionic.bundle.min.js"&gt;&lt;/script&gt;
  &lt;div ng-app="ionicApp"&gt;
    &lt;ion-content&gt;
      &lt;!-- Row --&gt;
      &lt;div class="row row-center"&gt;
  
        &lt;div class="col col-75"&gt;
          &lt;!-- Card --&gt;
          &lt;a href="{link to a part}"&gt;
            &lt;div class="card"&gt;
              &lt;!-- Image of the Card --&gt;
              &lt;div class="item item-image"&gt;
  
                &lt;img class="card-bg" src="http://placehold.it/800x200"/&gt;
                
              &lt;/div&gt;
            &lt;/div&gt;
          &lt;/a&gt;
        &lt;/div&gt;
  
        &lt;div class="col col-25"&gt;
          &lt;!-- Card --&gt;
          &lt;a href="{link to a part}"&gt;
            &lt;div class="card"&gt;
              &lt;!-- Image of the Card --&gt;
              &lt;div class="item item-image"&gt;
  
                &lt;img class="card-bg" src="http://placehold.it/500x400"/&gt;
  
              &lt;/div&gt;
            &lt;/div&gt;
          &lt;/a&gt;
        &lt;/div&gt;
  
      &lt;/div&gt;
    &lt;/ion-content&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p><a href="http://jsfiddle.net/mamos98/cysjn14t/" rel="nofollow">JSFiddle Link</a></p>