Responsive, rounded CSS right-triangle that resizes according to its parent's height

This question is similar to this one : Triangle/arrow rounded corners using :before

But this time, I need the triangle to resize according to the parent’s height (so no fixed-size is possible)


You can do something like this with clip-path.

It would be a bit fiddly to get the rounded pointer though.


This is the same technique but with pseudo elements to get a border on the arrow.


Amazing @PaulOB ! Thanks a lot!

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.