W3C home > Mailing lists > Public > www-style@w3.org > November 2010

Re: [css3-images] Proposed Gradients changes

From: Brad Kemper <brad.kemper@gmail.com>
Date: Mon, 29 Nov 2010 07:31:04 -0800
Cc: "Tab Atkins Jr." <jackalmage@gmail.com>, www-style list <www-style@w3.org>
Message-Id: <1F4C4C78-C7D8-4419-A16C-596A4F19545A@gmail.com>
To: Rik Cabanier <cabanier@adobe.com>

On Nov 28, 2010, at 11:38 PM, Rik Cabanier wrote:

> The radial gradient spec seems more complicated than it needs to be. 
> Extending my proposal for axial to radial:
> radial-gradient(startx starty endx endy, radius1 radius2 ratio, endpoint-color,...)
> with 
> startx, starty = position of the centerpoint of first endpoint (default: center center like background-position)
> endx, endy = position of the centerpoint of the last endpoint (default: center center)
> radius1 = radius of the inner circle (default: 0% like background-size)
> radius2 = radius of the outer circle (default: 50%)
> ratio = the ratio of the height/width of the circle. (default: auto = ratio of the bounding box)
> wouldn't this cover most of what you're trying to accomplish? My proposal also includes moving the focal point.

Actually, if you suppose that most radial gradients are going to be used in backgrounds, then the current syntax is already over-complex, and should just be reduced down to the following, to be centered in the image box  and filling it to the sides:

radial-gradient(<color-stop>[, <color-stop>]+)

The rest could be mostly handled by background properties, especially 'background-position' and 'background-size'.* Any other added complexity to the syntax would mainly benefit 'list-style-image'. I can't see that there would be a lot of demand for stretched radial gradients with a lot of controls in border images. So really the question is how much more control do we really need for bullet point radial gradients, which would also give a little more control in border-image radial gradients as a bonus? Or does anyone really think it is important to be able to tile radial gradients that are clipped in unusual ways to rectangular boxes, without using SVG to do it?

* I would also propose that 'background-size:cover' would work a little differently for radial-gradient images, so that the gradient goes from center to corners ('background-size:contain' would go from center to edges). 
Received on Monday, 29 November 2010 15:31:42 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:38:41 UTC