Re: Gradient syntax proposal

On Wed, Aug 19, 2009 at 4:59 PM, David Perrell<davidp@hpaa.com> wrote:
> Tab Atkins Jr. wrote:
> | ...any *more* examples?
>
> http://hpaa.com/csstest/grad-degrade.htm

Thanks!

Hmm.  In the 200px case, the two display fairly similarly; close
enough that I'm willing to call it a wash.

In the 100px case there is a noticeable difference, though probably
not a *significant* difference - even in the one that preserves the
gradient, it's dropped to a very short, sharp one spanning a mere 5
pixels.  In either case, the 30px green sides, which are presumably
meant to be have padding overlaid on them to keep content out, are
causing a problem all by themselves, independent of the gradient
fades.  You should probably have a min-width placed on the box to
prevent it from ever getting that small in the first place, or specify
the green sides in % as well.

Also, the WG talked not long ago about the introduction of the max()
and min() functions, which would help in situations like these.  You
could specify the wheat stop as "wheat max(20%, 50px)", ensuring that
the green->wheat transition remains *at least* 20px wide.  Specifying
the far stop is a bit more complicated, unfortunately - "wheat
min(80%, calc(100% - 50px))" or "wheat calc(100% - max(20%, 50px))".

So, so far, I'm still inclined to keep percentages measuring from the
start, just like lengths.

~TJ

Received on Wednesday, 19 August 2009 22:22:17 UTC