¿Hay alguna manera de que podamos extender la tarjeta que está en la celda hasta el final de la mesa? que no habrá relleno, como se puede ver en la flecha de la captura de pantalla, quería extender la tarjeta hasta el final.

#html

 <mat-table class="-card" [dataSource]="table.dataSource" [@animateStagger]="{value:'50'}" matMultiSort (matSortChange)="table.onSortEvent()" (contentChanged)="isLoadingTableData = false"> <ng-container matColumnDef="status"> <mat-header-cell *matHeaderCellDef mat-multi-sort-header="status" > <span class="text-left">DATA</span> </mat-header-cell> <mat-cell *matCellDef="let model"> <div class="card" style="width:100%;padding: 16px 16px 16px 16px !important;"> <div fxLayout="row"> DATA TEST </div> </div> </mat-cell> </ng-container> <mat-header-row *matHeaderRowDef="table.displayedColumns;" style="padding-bottom: 16px;"> </mat-header-row> <mat-row *matRowDef="let item; columns: table.displayedColumns;" style="cursor: pointer;"> </mat-row> </mat-table>

#css

 .card{ background: #FFFFFF; box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px rgba(0, 0, 0, 0.14), 0px 1px 8px rgba(0, 0, 0, 0.12); border-radius: 4px; /* padding: 16px; */ margin-bottom: 16px; }