CODEWITHSUNDEEP
angularangular-material
B.Cos
B.Cos

Reputation: 448

Angular material table mat row hover change preset background color

I have a angular material table that have a preset background color on column name

.mat-column-name {
  background-color: grey;
}

but when I try to change the background color when hover, the column name it wont change the background color

.mat-row:hover {
  background-color: red;
}

How to force it change? I try put !important also not working This is demo stackblitz

Upvotes: 1

Views: 2292

Answers (1)

OctavianM
OctavianM

Reputation: 4617

You should add another more specific CSS rule so that the name column will also have red background whenever the row is hovered. Try this:

.mat-row:hover,
.mat-row:hover .mat-column-name {
  background-color: red;
}

Upvotes: 2

Related Questions