How to create straight corners with CSS border-radius? [duplicate]
This question already has an answer here:
I am trying to create this kind of straight corner with the CSS border-radius property:
But so far I am only getting the basic CSS rounded corners. Does anyone have a solution for this? I am trying not to use an image to create the effect.
Thanks in advance.
Well, border-radius will always create a rounded Edge (or have you ever seen a Polygon with a radius?). I would create a scaleable svg image with the border (and transparency in the middle, in order to let you switch the background color in your css) and use it as the background of the box.
EDIT: Well, maybe look at the other question that is linked here. Those answers are better than mine.