Quick selector question

.column-diensten:hover > .column-diensten .et_pb_blurb_0 .et-pb-icon,
.column-diensten:hover > .column-diensten .et_pb_module_header,
.column-diensten:hover > .column-diensten .et_pb_button{
filter: invert(100%) !important;
}
.column-diensten:hover > .column-diensten .et_pb_blurb_0 .et-pb-icon,
.column-diensten:hover > .column-diensten .et_pb_module_header,
.column-diensten:hover > .column-diensten .et_pb_button{
filter: invert(100%) !important;
}
13 Replies
Ã̶̅n̴̊͑k̴̾͌s̵̒̐e̵͗̒l̴̿͋
What is wrong with this code? I'm trying to make it that when i hover on the .column-diensten, every other class mentioned will invert
Mannix
Mannix3y ago
first one will work for an element with class .et-pb-icon that is inside element with class .et_ob_blurb_0 that is inside element with class .column-diensten that is inside element with class column-diensten
Ã̶̅n̴̊͑k̴̾͌s̵̒̐e̵͗̒l̴̿͋
So maybe something like this? I deleted the class .column-diensten after the ">"
.column-diensten:hover > .et_pb_blurb_0 .et-pb-icon
.column-diensten:hover > .et_pb_module_header
.column-diensten:hover > .et_pb_button{
filter: invert(100%) !important;
}
.column-diensten:hover > .et_pb_blurb_0 .et-pb-icon
.column-diensten:hover > .et_pb_module_header
.column-diensten:hover > .et_pb_button{
filter: invert(100%) !important;
}
Mannix
Mannix3y ago
i'm guessing your is different
Ã̶̅n̴̊͑k̴̾͌s̵̒̐e̵͗̒l̴̿͋
this is my html, i'm working in wordpress
Ã̶̅n̴̊͑k̴̾͌s̵̒̐e̵͗̒l̴̿͋
i'm trying to say, when i hover over the grey area '.column-diensten' Then everything will turn white or invert
Mannix
Mannix3y ago
try .column-diensten * {}
Ã̶̅n̴̊͑k̴̾͌s̵̒̐e̵͗̒l̴̿͋
that works except for the button
Mannix
Mannix3y ago
then you need add separate rule for button. I suspect specificity issue
MarkBoots
MarkBoots3y ago
tip: use your inspector and see what styles are applied on the button.
Ã̶̅n̴̊͑k̴̾͌s̵̒̐e̵͗̒l̴̿͋
i somehow found it thanks! didn't know you could use * wiht something like this
Want results from more Discord servers?
Add your server