title: Separating Angular Material cards vertically
body: <p>I want to list items in an array vertically with cards, but there is no space between them. I tried to use padding but it seems it doesn't work.</p>
  
  <p><a href="https://ibb.co/eXtg7e" rel="noreferrer">card image</a></p>
  
  <p>How can I have these cards spaced?</p>
  
  <pre><code>&lt;ng-container *ngIf="titles?.length; else noTitle"&gt;
      &lt;mat-card class="asd cardPardding" *ngFor="let title of titles"&gt;
        &lt;p&gt;
        {{title}}
        &lt;/p&gt;
      &lt;/mat-card&gt;
    &lt;/ng-container&gt;
  
    &lt;ng-template #noTitle&gt;
      &lt;mat-card class="asd cardPardding"&gt;
        &lt;p&gt;
        No title !
        &lt;/p&gt;
    &lt;/mat-card&gt;
    &lt;/ng-template&gt;
  </code></pre>
  
  <p>This is css</p>
  
  <pre><code>.asd {
    width: 80%;
    margin: 0 auto; /* Added */
  }
  
  .inputasd {
    width: 100%;
  }
  
  .cardPadding {
    padding: 100px;
    margin-bottom: 50px;
  }
  </code></pre>