title: Set ion-row height size in Ionic2
body: <p>I need 3 horizontal rows in my page: the first row containing 3 columns, 2nd containing 2 and the 3rd containing 1; however I am unable to set the height of the rows. It all should be of same size and occupy the whole content area. The below code will make the rows occupy only a small portion of the content area.  If I specify the height of the row class in % it is not changing; however in pixels it is working, but I don't want my code to be this rigid. Thanks in advance for any help!</p>
  
  <pre><code>&lt;ion-content&gt;
  &lt;div style = "height : 37%; width : 83px; width : 100%; padding : none; border-bottom: 1px solid #D8DFEC; margin : none; background-size: 100% 100%; background-position: center; background-image: url('images/MyHome.PNG'); border-top: 1px solid #D8DFEC; border-bottom: 1px solid #D8DFEC"&gt;&lt;/div&gt;
  &lt;ion-grid&gt;
  
   &lt;ion-row text-center&gt;
  
    &lt;ion-col col-4&gt;A&lt;/ion-col&gt;
    &lt;ion-col col-4&gt;B&lt;/ion-col&gt;
    &lt;ion-col col-4&gt;C&lt;/ion-col&gt;
  
   &lt;/ion-row&gt;
  
  
   &lt;ion-row text-center&gt;
  
    &lt;ion-col col-4&gt;D&lt;/ion-col&gt;
    &lt;ion-col col-4&gt;E&lt;/ion-col&gt;
  
  
   &lt;/ion-row&gt;
  
   &lt;ion-row text-center&gt;
  
    &lt;ion-col col-4&gt;F&lt;/ion-col&gt;
  
  
   &lt;/ion-row&gt;
  
  &lt;/ion-grid&gt;
  &lt;/ion-content&gt;
  </code></pre>