Loading…
18
Burned 4 hours on a CSS mask blend that one display property fixed
Ngl, I was building this jagged edge section for a client's landing page and thought I needed some crazy SVG mask with blend modes to get the torn paper effect. I sat there for a solid 4 hours tweaking mask-image and mix-blend-mode, watching it fall apart in Firefox every time. Turns out the whole thing just needed clip-path with a polygon and a tiny calc() trick. Wasted a whole afternoon because I assumed it had to be fancy when the boring solution was right there. I even messaged a buddy at 11pm asking if he ever fought this and he sent back one line: 'why not just clip it and move on.' That stung. Has anyone else burned serious time overcomplicating a visual effect that a basic property could handle in like 20 minutes?
0 comments
Log in to join the discussion
Log In0 Comments
No comments yet
Be the first to share your thoughts on this discussion.