[Proposal] Respect border-radius for border-image

Currently, when using border-image on an element, border-radius is ignored.

In my opinion, this greatly reduces the usefulness of border-image altogether as border-radius is very commonly used. This limitation forces developers back to hacks, such as introducing an additional element and adding padding to it, defeating the purpose of border-image.

My understanding is that this limitation at the time was intended, mostly due to implementation difficulties.

This is just a lazy question to check if those conditions still apply today? Is better, more expected behavior up for discussion, or is it a definitive no-go?

A question that comes to my mind here is, how do you imagine border-radius to affect the border image?

I see two answers to this question:

1. Clip the border image.

   The specification currently explicitly excludes border-image when clipping the corners, but unfortunately doesn’t state the reason for this.

   One issue I see with this is that when the corner radius is bigger than the width of the border, the corners are interrupted. But for smaller radii and especially in combination with the fill value of border-image-slice it should look good.

2. Transform the border image

   Technically surely much more complicated, but supposedly visually nicer than just clipping, the border image would be “bended” so that it aligns with the radius of the corner.

   The specification currently doesn’t explicitly mention the exclusion of border-image in its “Corner Shaping” section, though I guess that’s just an oversight and no implementor considered it so to have any effect on the border image.

Thank you for your reply. My expectation would be scenario 1, but 2 sounds good as well compared to the current scenario of no support