Isolation Issue
Hello, greetings from Colombia, I have this issue, even tho i used isolate, my card::after is not shown behind my card, I want it to be behind and also to be affected by the blur from the backdrop filter, any ideas?
5 Replies
If you use isolate it creates a new stacking context and the children won’t be able to escape outside of it including behind it. For backdrop filter blur to have any effect , you have to work with some level of alpha values/transparency
yes, look, the blur affects the body, but not the after, the .cad1::after doesnt even go behinf the .card1 container, which is the main point of the isolation
As clevermissfox has already pointed out, the isolation is causing a new stacking context. However the main culprit here is the backdrop-filter as that creates it's own stacking context which is hard (impossible) to break out of.
However, it is possible to achieve what you need to do if you create another psuedo element and give that your background color and backdrop filter blur.
As long as this has a higher z-index than the other psuedo element it should work.
Thank you somuch, really apprecciate your help, both of you, thanks!!