title: How to set height on <ion-img>
body: <p>I have an ionic page with an <strong>ion-img</strong> inside:</p>
  
  <pre><code>&lt;ion-content&gt;
    &lt;ion-grid&gt;
      &lt;ion-row class="ion-padding" align-items-center justify-content-center&gt;
        &lt;ion-item&gt;
          &lt;ion-label text-wrap class="ion-text-center"&gt;
            Servicio de reportes
          &lt;/ion-label&gt;
        &lt;/ion-item&gt;
      &lt;/ion-row&gt;
      &lt;ion-row align-items-center justify-content-center &gt;
        &lt;ion-button size="smaill" type="submit" expand="block" routerDirection="forward" (click)="selectSource()" &gt;Capturar imagen&lt;/ion-button&gt;
      &lt;/ion-row&gt;
      &lt;ion-row&gt;
        &lt;ion-col&gt;
  
          &lt;ion-img [src]="selectedImage" *ngIf="selectedImage"&gt; &lt;/ion-img&gt;
  
        &lt;/ion-col&gt;
      &lt;/ion-row&gt;
    &lt;/ion-grid&gt;
  &lt;/ion-content&gt;
  </code></pre>
  
  <p>When a picture is set to <strong>selectedImage</strong> it occupies the whole screen and more. I have to scrrol to see the full image.</p>
  
  <p>I want the image to occupy 20% of the screen or a fix height.</p>
  
  <p>I tried to do this in css:</p>
  
  <pre><code>ion-grid {
    height: 100%;
  
    ion-row {
      max-height: 33.33%;
    }
  }
  </code></pre>
  
  <p>And also I tried to do with height property:</p>
  
  <pre><code> &lt;ion-img height: 10rem; [src]="selectedImage" *ngIf="selectedImage"&gt; &lt;/ion-img&gt;
  </code></pre>
  
  <p>And the image continues occupying the same space</p>
  
  <p>How should I do this? Thanks for help.</p>