How do I center Angular Material table column headers and mat-cell content

If no answer is working above then try this :

table {
  width: 100%;
}

mat-header-cell, mat-cell {
  justify-content: center;
}

or

angular material 2 table header center alignment

use this style with !important

th.mat-header-cell {
  text-align: center !important;
}

This exactly works for mat-table.

td, th {
    text-align: center !important;
    vertical-align: middle !important;
}

.mat-sort-header-container {
    justify-content: center !important;
}

you can achieve that easily if you use this layout of table

<table mat-table [dataSource]="dataSource" style="width: 100%;">

   <!-- identification Column -->
   <ng-container matColumnDef="identification">
       <th mat-header-cell *matHeaderCellDef> ID </th>
       <td mat-cell *matCellDef="let element"> {{element.identification}} </td>
  </ng-container>

  <!-- value Column -->
  <ng-container matColumnDef="total">
    <th mat-header-cell *matHeaderCellDef> Value </th>
    <td mat-cell *matCellDef="let element"> {{ element.value | currency: 'ILS' }} </td>
  </ng-container>


  <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
  <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>

</table>

and put this in where-the-table-is.component.css

td.mat-cell, th.mat-header-cell {
    text-align: center;
    justify-content:center;
}

You can use text-align: center

Here is an example StackBlitz tweaked from the Material docs

Try this, It's work for me.

:host ::ng-deep .mat-sort-header-container {
   display: flex;
   justify-content: center;
}

You can create css class

.centre {
  text-align: center
}

and add it to your html

<th mat-header-cell *matHeaderCellDef class="centre"> Symbol </th>

just like here: https://stackblitz.com/edit/angular-qfav5c?file=app%2Ftable-basic-example.css

This works for me

:host ::ng-deep .mat-sort-header-container {
  display: flex;
  justify-content: center;
}

table {
  text-align: center !important;
  width: 100%;
}

If you are using a sorted header you need to provide

table {
    width: 100%;
    text-align: center !important;
}

.mat-sort-header-container{
    justify-content: center;
}

.mat-header-cell {
    text-align: center !important;
}

Try using class text-center

<td mat-cell *matCellDef="let element" class="text-center"> {{element.multiplicador}} </td>

This works for me:

td, th {
text-align: center !important;
vertical-align: middle !important;
}
:host ::ng-deep .mat-sort-header-container {
display: flex;
justify-content: center;
}