Streaming live at 10am (PST)

Adding a filter to my section affects my child elements

I’m trying to blur my section’s background image, without having it blur all of the child images as well. I know it can be done, cause of seen examples of it on the tutorials. I’m one week new to Webflow, so I’m still working my way around it.


https://preview.webflow.com/preview/joes-super-cool-site?utm_medium=preview_link&utm_source=dashboard&utm_content=joes-super-cool-site&preview=53239fc579f6e09c739b564acaa21ee7&mode=preview

I’ve experienced this problem before as well. The solution I found was to remove the background image from the section, add a div inside the section that is absolutely-positioned and set to “fill”, then you can add a filter to that div without affecting the rest of the elements. Just remember to move the z-index of your section elements above the background div.

2 Likes

I just tried your recommendation, but it’s still not working for me. Clearly, it’s working for you, so I’m not sure what I’m doing wrong.