Filter not on child
Hi, i'm trying to make an effect where the background is grayscale 100% and the child isn't while using the :not
here is an example: https://codepen.io/axl-prudhomme/pen/NWzbLQB?editors=1100
so the center shouldn't be grayscale and the outer should.
4 Replies
filters are applied to the whole element(including childs)
if you want only the parent to have a filter, do it on a pseudo element
![](https://utfs.io/f/1ef671fa-d3f9-4edd-b8ef-7f13efafa3f3-1nq2cb.png)
oh i see, so there is no way to do it with :not?
unfortunatly not. the element has a filter, childs are part of that element. you can't take it away
I think you're misunderstanding what
:not
does. It's not a way to exclude something from another selector, .parent:not(.child)
doesn't mean "select .parent
but not .child
inside it", it means "select .parent
that isn't also .child
"