I am using a Background Blur (2px) on the header image for a website I’m building. The Hero is a Container and the image is the Background.
Along the bottom edge, where the Hero Container meets the first content block Container, I see a thin line of the unfiltered background image/blur seeping out.
If you can see the edges blurred (inside the container) you can also use the transform property to scale up the image slightly to avoid this. It’s kinda the same thing you’d do in a graphics program like Photoshop.
does transform not scale the container, not able to check at the moment, so might be wrong, anyway 2px not sure that would be noticed as a shadow like effect.