# Blur Showing on Bottom Edge

**URL:** <https://forums.realmacsoftware.com/t/blur-showing-on-bottom-edge/56336>\
**Category:** Elements\
**Created:** [May 27, 2026, 1:07pm UTC](https://forums.realmacsoftware.com/t/blur-showing-on-bottom-edge/56336 "2026-05-27T13:07:47Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![chet](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/chet/32/35396_2.png) [@chet](https://forums.realmacsoftware.com/u/chet)\
**Post date:** [May 27, 2026, 1:07pm UTC](https://forums.realmacsoftware.com/t/blur-showing-on-bottom-edge/56336/1 "2026-05-27T13:07:47Z")

</div>

I am using a Background Blur (2px) on the header image for a [website I’m building](https://sandboxlab.io/pam26/contact/). 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.

 ![Screenshot 2026-05-27 at 9.06.58 AM](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/2/8/28fe60d4825c0031ea640b193fa7577df47a7218.png)

How do I keep the blur contained to its Container?

---

<div class="post-metadata">

**Author:** ![dan](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/dan/32/28516_2.png) [@dan](https://forums.realmacsoftware.com/u/dan)\
**Post date:** [May 27, 2026, 1:19pm UTC](https://forums.realmacsoftware.com/t/blur-showing-on-bottom-edge/56336/2 "2026-05-27T13:19:47Z")

</div>

Hmmm, I’ve not seen that issue before 🤔

Can you share the project via Elements Cloud and we’ll take a look for you ☺

---

<div class="post-metadata">

**Author:** ![chet](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/chet/32/35396_2.png) [@chet](https://forums.realmacsoftware.com/u/chet)\
**Post date:** [May 27, 2026, 2:10pm UTC](https://forums.realmacsoftware.com/t/blur-showing-on-bottom-edge/56336/3 "2026-05-27T14:10:23Z")

</div>

~~Here’s the project file.~~

---

<div class="post-metadata">

**Author:** ![upssjw](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/upssjw/32/26063_2.png) [@upssjw](https://forums.realmacsoftware.com/u/upssjw)\
**Post date:** [May 27, 2026, 3:03pm UTC](https://forums.realmacsoftware.com/t/blur-showing-on-bottom-edge/56336/5 "2026-05-27T15:03:08Z")

</div>

probably work with an image in the container, set to absolute. The container inset to twice your blur or adjust, not at Elements at the moment

---

<div class="post-metadata">

**Author:** ![dan](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/dan/32/28516_2.png) [@dan](https://forums.realmacsoftware.com/u/dan)\
**Post date:** [May 27, 2026, 3:08pm UTC](https://forums.realmacsoftware.com/t/blur-showing-on-bottom-edge/56336/6 "2026-05-27T15:08:08Z")

</div>

@chet, easy fix, you just need to set the overflow to Hidden on the container 😉

Here’s a video to explain why this is happening and how to fix it…

---

<div class="post-metadata">

**Author:** ![upssjw](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/upssjw/32/26063_2.png) [@upssjw](https://forums.realmacsoftware.com/u/upssjw)\
**Post date:** [May 27, 2026, 3:36pm UTC](https://forums.realmacsoftware.com/t/blur-showing-on-bottom-edge/56336/7 "2026-05-27T15:36:04Z")

</div>

Do you not get an internal type shadow from doing that

---

<div class="post-metadata">

**Author:** ![dan](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/dan/32/28516_2.png) [@dan](https://forums.realmacsoftware.com/u/dan)\
**Post date:** [May 27, 2026, 3:47pm UTC](https://forums.realmacsoftware.com/t/blur-showing-on-bottom-edge/56336/8 "2026-05-27T15:47:35Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![upssjw](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/upssjw/32/26063_2.png) [@upssjw](https://forums.realmacsoftware.com/u/upssjw)\
**Post date:** [May 27, 2026, 4:23pm UTC](https://forums.realmacsoftware.com/t/blur-showing-on-bottom-edge/56336/9 "2026-05-27T16:23:18Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![dan](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/dan/32/28516_2.png) [@dan](https://forums.realmacsoftware.com/u/dan)\
**Post date:** [May 27, 2026, 4:40pm UTC](https://forums.realmacsoftware.com/t/blur-showing-on-bottom-edge/56336/10 "2026-05-27T16:40:11Z")

</div>

Not if you have overflow hidden on 🙂

Here’s the full workflow…

---

<div class="post-metadata">

**Author:** ![upssjw](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/upssjw/32/26063_2.png) [@upssjw](https://forums.realmacsoftware.com/u/upssjw)\
**Post date:** [May 27, 2026, 4:47pm UTC](https://forums.realmacsoftware.com/t/blur-showing-on-bottom-edge/56336/11 "2026-05-27T16:47:33Z")

</div>

@dan like to test you​😂😂🤣🤣

No access to Elements, good to know, just scale image

same as my example scale image in absolute and use inset on the container

Check before I question
