Nostyle is changed for Angular Material Dynamic Table

Question

I used this angular material dynamic table. I want to change columns width but I could not change any style in that table. This is demo page for testing. I added below CSS for testing whether anything changes:

table, table td, table tr td, table th, .mat-cell, mdt-dynamic-table, mdt-dynamic-table table {
  background-color: red;
}

Why any styles are not working for that table? How can I resize column width or change any style?

Answer 1

Looks like your table is not part of the component where you want to style it.

Did you try with ::ng-deep ?

https://angular.io/guide/component-styles

:host ::ng-deep table {
  background-color: red;
}