I want a CSS rule to apply to all <ul>
elements except those who have an ancestor whose class is editable
, whether that ancestor is their direct parent or no.
The actual type of the ancestor element is not important. So for instance:
<div>
<ul> <!-- Apply style here -->
<li>hello</li>
</ul>
</div>
<figcaption class="editable">
<div>
<ul> <!-- No style here-->
<li>hi</li>
</ul>
</div>
</figcaption>
<figcaption class="editable">
<ul> <!-- No style either-->
<li>hello</li>
</ul>
</figcaption>
I've tried:
*:not(.editable) > ul
==> rule is not applied to immediate children as desired but is applied on non immediate children
*:not(.editable) ul
==> rule is applied to all children
I know I can use .editable ul
to apply a style to the elements I want but that's not exactly what I want, since what I want to do is prevent the style from being added in the first place.
` you want to edit an ID?
– xmaster Mar 24 '20 at 09:17