Re: [css3-background] Curved borders intersecting backgrounds of inner boxes

On Apr 11, 2010, at 4:17 PM, Zack Weinberg wrote:

> Zack Weinberg <zweinberg@mozilla.com> wrote:
> 
>> Have a look at
>> http://people.mozilla.org/~zweinberg/inner-background-clip.xhtml in a
>> browser that supports border-radius, inline SVG, and preferably also
>> inset box-shadow.  (If you don't have inset box-shadow, ignore the
>> right column.)
> 
> FYI, I've uploaded a corrected version of this test case.  The box
> shadows work in Webkit now, and the SVG box shadow is a much closer
> approximation to how Firefox and Webkit draw it.  Also, it has links to
> screen shots.

It is pretty weird that Webkit still clips to the outside of the border at the curved borders, when the overflow is 'hidden', and that mozilla still doesn't clip to any curve. I brought this up some time ago, and the following was added to the backgrounds and borders module to clarify what should happen:

> Backgrounds, but not the border-image, are clipped to the appropriate curve (as determined by ‘background-clip’). Other effects that clip to the border or padding edge (such as ‘overflow’ other than ‘visible’) also must clip to the curve. The content of replaced elements is always trimmed to the content edge curve. Also, the area outside the curve of the border edge does not accept mouse events on behalf of the element.