- From: Brad Kemper <brad.kemper@gmail.com>
- Date: Wed, 12 Oct 2011 08:00:45 -0700
- To: "L. David Baron" <dbaron@dbaron.org>
- Cc: "Tab Atkins Jr." <jackalmage@gmail.com>, Sylvain Galineau <sylvaing@microsoft.com>, Alan Gresley <alan@css-class.com>, Brian Manthos <brianman@microsoft.com>, "www-style@w3.org" <www-style@w3.org>
On Oct 11, 2011, at 5:50 PM, "L. David Baron" <dbaron@dbaron.org> wrote:
> Converting between 'contain' and 'cover' mathematically is only
> possible for ellipse gradients; for 'circle' gradients there's no
> single factor since the factor depends on the aspect ratio of the
> box.
With my proposal, 'circle' gives the image a 1/1 height/width ratio (or half that for circles centered on one edge) . So if you wanted a background that was covered with the gradient, without distorting the perfect circle-ness, then this would work:
background-image: radial-gradient(circle, yellow, red 141%);
background-size: cover;
The 'circle' part makes it a square image, the 141% extends the color to the corners, and the 'background-size: cover' ensures that it fills the background without distortion.
One of my goals, as with the changes that were made to linear-gradient, was to not have a lot of duplication between background properties and gradient parameters. For one, we don't need to recreate backgrounds within the image, when background is by far the most common way to use images. Secondly, it is a recipe for confusion when there are multiple ways to create the exact same effects. It is much more clear and easy to learn when there is one "normal" way to create a given effect (not including unit conversions, extra spaces/tabs, etc.). It can be especially confusing when using background shorthand and the same or equivalent keywords and measurements are used inside and outside the measurement part for no good reason (other than, perhaps, for intentional obfuscation, as Brian suggested).
I think if other uses of images ('content' property, filters, etc.) don't have ways to move, size, or clip an image, then they should get them, if that is important. It is no less important for raster images and SVG than it is for this flavor of generated images.
Received on Wednesday, 12 October 2011 15:01:33 UTC