title: angular 4 angular-material mat-card in only row
body: <p>I need of place side by side in only row 2 mat-card.. how can I do?</p>
  
  <pre><code>&lt;mat-card class="example-card"&gt;
    &lt;mat-card-header&gt;
      &lt;div mat-card-avatar class="example-header-image"&gt;&lt;/div&gt;
      &lt;mat-card-title&gt;Shiba Inu&lt;/mat-card-title&gt;
      &lt;mat-card-subtitle&gt;Dog Breed&lt;/mat-card-subtitle&gt;
    &lt;/mat-card-header&gt;     
    &lt;mat-card-content&gt;        
    &lt;/mat-card-content&gt;     
  &lt;/mat-card&gt;
  </code></pre>
  
  <p>I want to get this</p>
  
  <p><a href="https://i.stack.imgur.com/7C5sZ.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/7C5sZ.jpg" alt="enter image description here"></a></p>