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

"L. David Baron" <dbaron@dbaron.org> wrote:

> On Saturday 2010-04-10 17:14 -0700, Zack Weinberg wrote:
> > As far as I know, in the absence of border-radius, border-image, or
> > inset box-shadow it is impossible to make a nested box's background
> > overlap a containing box's border.  It seems to me that putting the
> > nested background under the containing border (and inset shadow) and
> > clipping it to the curve is always the right thing.
> 
> Well, nested boxes' backgrounds can extend way out of their
> containing element once explicit heights, negative margins, and a
> bunch of other features are used.  Clipping those boxes is what
> 'overflow: hidden' is for.

Those seem qualitatively different, somehow, though I would be hard
pressed to explain why.  Maybe just that it's pretty easy to get a bad
rendering like the one in my row two 'by accident' with border-radius,
whereas if you set a negative margin, that has to be deliberate.

> And I think once browsers fix their bugs
> with border-radius on elements with 'overflow: hidden' (such as
> https://bugzilla.mozilla.org/show_bug.cgi?id=459144 ) you'll get the
> behavior that you want when 'overflow' is 'hidden'.

No, I think fixing bug 459144 in Gecko would only make it match the
current Webkit behavior on my test case - in row 3, inner background
clipped to the outer curve of the outer box, still drawn on top of the
border and the box-shadow - which is still not right, aesthetically
speaking.

> Are you proposing that certain clipping happen under some conditions
> even when 'overflow' is visible?

I might be proposing that *backgrounds* (not content) be clipped to
border-radius curves even when 'overflow' is visible.  I could probably
be convinced that this is not necessary.

More importantly, though, I am proposing a change to the stacking
order, so that the border and the inset box-shadow of a box get drawn
on top of all backgrounds, borders, and shadows of all boxes that it
contains (but not the content, which remains in its own stack).

zw

Received on Sunday, 11 April 2010 01:05:33 UTC