Center text in angular snackbar

Question

what would be the correct way to center text in an angular snackbar?

I've tried this, which doesn't work:

let config = new MatSnackBarConfig();
config.panelClass = 'center';
this.snackBar.open(message, undefined, config);

and then in some css file (either the same component, or in the global file):

.center {
   justify-content: center;
}

Answer 1

You can do it with open() and panelClass but you need to modify your CSS:

.center > .mat-simple-snackbar {
  justify-content: center;
}

Answer 2

Material Guide aside, this works for our software product:

.mat-snack-bar-container {
    text-align: center;
}

.mat-simple-snackbar {
    display: inline-block !important;
}