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

RE: radial-gradient() proposal

From: David Perrell <davidp@hpaa.com>
Date: Mon, 7 Sep 2009 22:33:46 -0700
To: "www-style list" <www-style@w3.org>
Tab Atkins Jr. wrote:
| Specifically, when using closest-side, the vertical axis of the
| ellipse is the distance from the starting-point to the top or bottom
| of the box, whichever is closer, and similarly for the horizontal
| axis.  Thus there are two axis-aligned lengths that are relevant when
| discussing ellipses; the vertical axis and the horizontal axis.
| Now, one can certainly favor a particular axis over the other.
| Particularly, there will always be one side of the four that is the
| actual closest (or, to be precise, you can always choose a side which
| is not farther than any other side), and also one that is the actual
| farthest side.  This corresponds to choosing the minor axis under
| closest-side, and the major axis under farthest-side.

My argument was for a gradient-line that extends directly from the start-point to whichever side is nearest to or farthest from that point. The problem with that, as I see it, is that in some cases the gradient line can be on the same axis for both nearest and farthest sides. I do think it important in some cases to force the gradient line to the longest radius. I might want some tight <length> color stops on the major axis that can't be specified on the minor one, because the values will compress to sub-pixel lengths.
| However, I don't feel that this axis is important *enough* to justify
| favoring absolutely (though it may indeed be a decent choice by
| default).  In fact, I feel that it's often going to be *more*
| important to choose between "horizontal" and "vertical" than between
| "major" and "minor", as the former two allow you to control alignment
| with other design elements on the page.
| So, thoughts so far?  Excepting the final paragraph, do we agree 
| on all points?

Still feel that <angle> is inappropriate for anything except ellipse tilt - that to be consistent with linear-gradient, <angle> would describe the angle of the minor axis. But it looks like that's just me.

| Just to be certain, this is purely about the case where you're
| aligning with a corner, right, when <size> is closest-corner or
| farthest-corner?
| Can you illuminate?

Not without doing graphical examples of what happens when the box is resized, so I'll retract my contention (yes, it was about to-corner). Anyway, I doubt the feature would get as much use as, say, aspect-ratio.

| Ah, this may be the source of our mutual confusion, then.  Let me
| explain (and if you *do* know all this and instead are objecting to
| something else, just let me know):

I understand the effects you expound on, but have a hard time seeing the angle as being analogous to linear-gradient's <angle>, which specifies the gradient's direction. The radial-gradient's <angle> only effects the relative position of the color-stops.

"...is always 50px wide *in the direction specified*.  So that's the
significance of specifying the direction.  It lets you be certain that
the <length> you're using will actually align with things properly in
at least one direction.  In any other direction the length might be
stretched or squished as the ellipse deforms from a true circle."

"If you've ever used GIMP (I presume Photoshop works similarly), the
gradient-line is precisely the abstraction you use to draw gradients
of both types.  You click and hold at the center point, then drag a
line out to where you want the ending-shape to be and release.  That
line you pull out is the gradient-line that I reference in the

OK, your case is abstractly clarified. And your samples look good. 

Now, the gadfly must buzz off. Unfortunate events are forcing me to stop 'fiddling' with specs for a while. Take care all.

David Perrell
Received on Tuesday, 8 September 2009 05:34:42 UTC

This archive was generated by hypermail 2.4.0 : Monday, 23 January 2023 02:13:39 UTC