Re: [css3-background] does border-radius round the border-image ?

I did some test cases and saw how they rendered in a recent WebKit  
nightly and Firefox 3.2 nightly. I used 'background-clip:padding- 
box;', which shows the importance of not clipping the border-image  
based on the border-radius (at least not to do so in that situation,  
IMO, but I believe its the same problem with default background-clip,  
just not as obvious).:

http://www.bradclicks.com/cssplay/BorderImageAndRadius.html

I also found the following, that may reflect the fact that the  
properties I used are still experimental:

1. In Webkit, the background does not get clipped to the inside of the  
curved corners, and it really seems like it should (especially when  
combined with 'border-image').

2. In Firefox, the dotted border style is not honored within the  
rounded borders.


On Jan 10, 2009, at 4:34 PM, Brad Kemper wrote:

>>
>> I think border-radius should clip the border-image, just as it  
>> clips the background.  In many cases I believe the border-radius  
>> should clip the foreground too.  Border-image alone is not able to  
>> dictate this clipping behavior, so a designer *is* going to need to  
>> set both in order to clip the background and foreground content,  
>> regardless of fallback intentions.
>
> No question that it should clip the background (and foreground  
> replaced elements) when there is no border-image. I can even see the  
> point of maintaining that behavior on those parts (but not border- 
> image) when border-image IS in use. The border-image might contain a  
> more complex clipping (using a PNG, for instance), than the border- 
> radius could achieve on its own. That might be the use case for  
> using them together, in fact. The only use case for having the  
> border-radius clip the border-image, is if they both have the exact  
> same path to clip to anyway.

Received on Sunday, 11 January 2009 06:15:49 UTC