W3C home > Mailing lists > Public > www-style@w3.org > February 2014

Re: [css3-background] Corner clipping for images and gradients

From: Tab Atkins Jr. <jackalmage@gmail.com>
Date: Fri, 7 Feb 2014 09:19:48 -0800
Message-ID: <CAAWBYDB0xk-6yCuHC3Ta6s-Qtym0O+fwzG79V+n38vuBXi_UHA@mail.gmail.com>
To: Sebastian Zartner <sebastianzartner@gmail.com>
Cc: www-style list <www-style@w3.org>
On Fri, Feb 7, 2014 at 1:09 AM, Sebastian Zartner
<sebastianzartner@gmail.com> wrote:
> In Mozilla bug 969263[1] the question came up whether to clip gradients,
> elements and images defined in border-image. The current WD says[2] this:
>
> "A box's backgrounds, but not its border-image, are clipped to the
> appropriate curve (as determined by ‘background-clip’)."
>
> According to David Baron the WG's intent for url() is when defined in
> border-image it is allowed to *overhang* the box.
> Though this may not be what the author expects, especially in cases where
> gradients or elements are used. See the test case on the report mentioned
> above.
>
> One idea I can come up with to solve this is to add a new property
> ‘border-clip’, which accepts the same values as ‘background-clip’ plus an
> additional value, which avoids clipping, e.g. ‘none’.

Border-image does specifically overhang the border-radius curve.
Otherwise, there's no good answer to what the outset values mean.

While border-image *can* be combined with gradients to make a gradient
border, it's not the ideal in all cases, as you found.  What you'd
want for that case is to allow <image> types in border-color.

~TJ
Received on Friday, 7 February 2014 17:20:35 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:39:19 UTC