Is it possible to apply CSS to a div which has no visible children without using JQuery?
Example:
<div class="myparent">
<div class="invisible"> I'm invisible</div>
<div class="invisible"> I'm invisible</div>
dummy text
</div>
.invisible {
display: none;
}
.myparent {
background-color: green;
}
As style for the myparent class I'd like to use something like this.
.myparent :has(:not([style*="display:none"])) {
background-color: blue;
border: 1px solid red
}
Result in this case should be that the should have the blue background and a red border.