title: How to create a new row of cards using ngFor and bootstrap 4
body: <p>I'm trying to use the card group functionality of Bootstrap 4 with Angular <code>ngFor</code>.</p>
  
  <p>Here is the HTML I have for now, but I can't find how to break to a new line after 3 items have been inserted:</p>
  
  <pre><code>&lt;div class="row card-group"&gt;
      &lt;div *ngFor="let presentation of presentations" class="col-4 card"&gt;
          &lt;a [routerLink]="['/presentation', presentation._id]"&gt;{{presentation.title}}&lt;/a&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I've seen other answer saying to use the clearfix class, but this has not worked so far for me.</p>