Responsive `clip-path` units?
I've got a card that looks like this. The bottom right corner "carve-out" is accomplished with a
clip-path: path(..). The button inside the carve-out space is sized with rem units, and I'm wondering if there's a way to make the path(..) responsive to font-size as well. Currently stuff like l 96,0 refers to 96 pixels.
4 Replies
Here's the codepen https://codepen.io/ptrfrncsmrph-the-vuer/pen/RwzWvRe
you have to use percent, with the polygon function
or replace with a smaller clip-path when you need to
with the polygonHm, can I make rounded edges with
polygon? I'm currently using arc shapes in the path
I think I'll probably just avoid this design altogether, really just wanted to confirm my assumption that this would be tricky to make responsive 🙂no, you can't
you can have 500 points in the polygon, which will look round enough