How to remove spaces between entries?

Question

Angular

I have information that is displayed in the cards, but the problem is that they are displayed in a strange way in a scatter and with large gaps. How can this be fixed?

<div class="col-md-2" *ngFor="let note of notes | orderBy: key:reverse " >
  <div class="card card-stats" *ngIf="(note.note_type) == 0 && (note.spr_notes_id) == null">
    <div class="card-header" data-background-color="blue">
      <i class="material-icons">store</i>
    </div>
    <div class="card-content" >
      <p class="category">{{note.title}} </p>
    </div>
    <div class="card-footer">
      <div class="stats">
        <button class="button-save" ><i class="fa fa-eye"></i></button>    
        <button class="button-trash" ><i class="fa fa-trash"></i></button>    
      </div>
    </div>
  </div>                            
 </div>

Answer 1

Hello.
It's all about ngIf. ngFor creates a new col-md-2 column, and then ngIf doesn't pass the condition and so the space is empty. Since angular only allows one struct directive per element , one element needs to be added to ng-container.