Add example of rounded border-image

[Josh-Cena]

Fix https://github.com/mdn/content/issues/25875. I recently had to implement something very similar.

[github-actions[bot]]

Preview URLs

• /en-US/docs/Web/CSS/border-image

External URLs (1)

URL: /en-US/docs/Web/CSS/border-image Title: border-image

• https://github.com/w3c/csswg-drafts/issues/9456 (1 time) (Note! This may be a new URL 👀)

[estelle]

I am not sure if this is what you were trying to explain: https://codepen.io/estelle/pen/LYowRLv You can use clip-path: border-box; to provide outer rounded corners.

[Josh-Cena]

@estelle Your solution only rounds the outer edges, not the inner edge, which is still a rectangle. Try changing it to border-radius: 100px;. There's just no way to actually make border-image work.