Re: [gradients] basics

Tab Atkins Jr. wrote:
> On Tue, Nov 10, 2009 at 2:23 PM, fantasai <fantasai.lists@inkedblade.net> wrote:
>> I don't really understand what you're trying to do here. If you want
>> to fill the box and not necessarily keep the aspect ratio, you use
>> background-size: 100%. If you want to keep the aspect ratio, and clip
>> out the parts that don't fit inside the box, you use 'cover'. If you
>> want to keep the aspect ratio and size the image so that it /just/
>> fits the box, you use 'contain'.
> 
> Hmm.  The issue is the interaction of aspect ratios, clip boxes, and
> infinitely-size images.
> 
> First, what's the aspect ratio of the gradient?  I suspect just the
> size of the box used to paint it.  Another possible answer is the
> aspect ratio of the ellipse, or of the rise/run of the line, but I'm
> not certain that will act like we want.  Similarly, what are the
> intrinsic width and height?
> 
> Now, background-size mentions nothing about clipping, just scaling.
> It implicitly assumes an image with finite extent, so the notion of
> scaling it to a finite size makes sense.  That doesn't apply here.  Do
> we need to patch background-size, or patch gradients?  Current
> implementations take the latter route and make gradients *not*
> infinite, but that slightly damages what I think is a useful behavior
> (adjusting the background-position of a gradient to just make it slide
> around).
> 
> I'm not certain why you see 100%, contain, and cover as different
> cases, fantasai.  Can you explain this in more depth?

Hm, I think I'm just confused about what radial gradients are. :)
I'll have to look into that in more depth. What I described is how an
SVG image would behave but we've got something different here.

>> Now I think gradients should behave a little special in how they clip.
>> They should have a size, but their clip rect should be infinite. So if
>> you specify a gradient on the root element, it is sized and positioned
>> as for the root element, but its paint continues beyond the box to fill
>> the canvas. Similarly a gradient with 'contain' should be sized to that
>> container, but its paint should continue to fill the entire background
>> painting area. I'd even say any background-size value would size the
>> gradient but not clip it unless the gradient were repeated in that
>> dimension.
> 
> That's basically my idea.  background-size creates the abstract 'box'
> mentioned in the gradient spec (this is implicit, as background-size
> affects the used size of an image without intrinsic dimensions).  The
> gradient itself should be infinite and should spill paint out in all
> directions.
> 
> We should definitely clip in the direction of repetition.  Right now
> it clips in *all* directions, which isn't so cool.  Should this be
> fixed in Backgrounds & Borders so that we automatically act correctly
> with infinite images, or should it be fixed just in gradients, and
> we'll watch out for similar problems if we run into them again later?

I think we should define this in gradients, at least for now. I can't
think of another existing concept of "finite size, infinite paint"
images, and it's hard to explain without a concrete example.

~fantasai

Received on Tuesday, 10 November 2009 21:27:24 UTC