How do I change the label color of this disabled component using css only?

I tried using .ui-select-container[disabled] + label{ color: red } but that didnt work.
3 Replies
clevermissfox
clevermissfox2d ago
I can’t see the indentation but the + selects a sibling after the element. If the label and the ui-select-container are siblings but label comes before, you’ll need to select the parent with :has() which is fairly new and so exciting!
.parent:has(.child[disabled]) .childs-sibling { color: red;}
.parent:has(.child[disabled]) .childs-sibling { color: red;}
ἔρως
ἔρως2d ago
i would use :disabled over [disabled] not all properties set in js are reflected in the dom as attributes, and won't match the [disabled] but otherwise, it should work the same
AllaN
AllaNOP2d ago
Thanks a lot for you inputs it worked.

Did you find this page helpful?