Angular material overwrite style.css

I would suggest to create a separate .scss file reserved for styling globaly Angular Material elements, and importing it in the main styles.scss file. Answering your question – propably you’re not ‘specific’ enough. First of all it would be nice to add an additional custom class to your Material element so the custom styles will be applied only when this class is present. Example on styling {
   width: 100%;

   .mat-cell {
     font-size: 20px;
     padding: 20px;

You might nest the elements event more for higher css specificity

CLICK HERE to find out more related problems solutions.

Leave a Comment

Your email address will not be published.

Scroll to Top