Как разделить колонки с кнопками в angular material table

Я пытаюсь добавить две кнопки последовательно в angular material table:

displayedColumns: string[] = ['order_button', 'cancel_button'];

HTML:

  <ng-container matColumnDef="order_button">
    <mat-header-cell   *matHeaderCellDef ></mat-header-cell>
    <mat-cell   (click)="$event.stopPropagation()" *matCellDef="let row" >
         <button mat-flat-button color="primary"  >Order</button>
    </mat-cell>
  </ng-container>

 
  
<ng-container matColumnDef="cancel_button">
  <mat-header-cell   *matHeaderCellDef ></mat-header-cell>
  <mat-cell   (click)="$event.stopPropagation()" *matCellDef="let row" >
       <button mat-flat-button color="primary"  >Cancel</button>
  </mat-cell>
</ng-container>

Но они почему-то слиплись:

Как можно это исправить?