I’m attempting some slightly unique interactions with my portfolio site - using an SVG of the project name cutout to mask ( the image (set to z -1) of the project, then moving the image behind to create a parallax effect on scroll down.
I’ve run into a problem which is causing the image to bleed out from the edges of the name wrapper creating lines past the edges of the container. I’ve provided some screenshots of what I’m talking about:
I’ve tried hacking it and placing a white border around the parent div (inside and out), absolutely positioning a thin white div on the edge with a high z index - the image will always bleed out from the edge of the wrapper
Has anyone else come across something like this? Any help much appreciated.