W3C home > Mailing lists > Public > www-style@w3.org > January 2009

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

From: Brad Kemper <brad.kemper@gmail.com>
Date: Fri, 9 Jan 2009 16:20:06 -0800
Cc: www-style@w3.org
Message-Id: <0D52356C-67C4-4FB2-BC4B-C5E8DD15B73F@gmail.com>
To: "L. David Baron" <dbaron@dbaron.org>


On Jan 9, 2009, at 3:36 PM, L. David Baron wrote:

>
> http://dev.w3.org/csswg/css3-background/#the-border-radius says:
>  # Backgrounds, but not the border-image, are clipped to the inner,
>  # resp., outer curve of the border if ‘background-clip’ is
>  # ‘padding-box’ resp., ‘border-box’. Other effects that clip to
>  # the border or padding edge (such as ‘overflow’) also must clip
>  # to the curve.
>
> I can't tell if this is saying:
> 1. border images are not clipped by the rounding from border-radius
> 2. border images are always clipped by the outer edge of the curve
> (It's not clear whether border-image is included or excluded from
> "Other effects" given that it was excluded from the first part.)

The first sentence seems to be clear that border-images are not  
clipped by the rounding from border-radius in any way ("... not the  
border-image, are clipped to the ... curve of the border"). So I read  
it as not being included in "Other effects that clip to border or  
padding edge", as "other" would mean properties not already mentioned  
here.

Also, I think that is the way that would work best. If the border  
image is created with curved corners in mind, then there may be  
(intentionally) a little something extra in the border-image that  
sticks outside the rounded border. In fact, I would go so far as to  
change the first sentence of 4.4 from this:

# Specifies an image to use instead of the border styles given by the  
‘border-style’ properties and an additional background image for the  
element. If the value is ‘none’ or if the image cannot be displayed,  
the border styles will be used.

to this:

# Specifies an image to use instead of the borders created by the  
‘border-style’, 'border-width',  'border-color', 'border-radius', and  
'box-shadow' properties and an additional background image for the  
element. Unless the value is ‘none’ or if the image cannot be  
displayed, the element will be displayed as if border-style and 'box- 
shadow' had value of 'none' and 'border-radius' had a value of 0, and  
only 'border-image' will be used to generate any border, curved  
corner, or box shadow effects.


>
>
> For the record, according to
> https://bugzilla.mozilla.org/show_bug.cgi?id=472561 , Webkit rounds
> border images according to the border radius and Gecko does not.
>
> -David
>
> -- 
> L. David Baron                                 http://dbaron.org/
> Mozilla Corporation                       http://www.mozilla.com/
>
Received on Saturday, 10 January 2009 00:20:44 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:15 GMT