I recently came across an issue with filter:blur in CSS. Lets say our page has a nice Koala image that looks like this:
border: solid 5px black;
Now, lets apply a nice dose of Blur effect on it:
- Note: + stands for vendor prefix
Watch how the image exceeds the border of its container, and a "glowing" effect appears between the blurred image and the black border! Eww!
The blurred image now resides peacefully within its bounds. YEY :)