W3C home > Mailing lists > Public > www-style@w3.org > June 2011

Re: [css3-images] linear-gradient keywords and angles are opposite

From: fantasai <fantasai.lists@inkedblade.net>
Date: Thu, 09 Jun 2011 17:54:06 +0900
Message-ID: <4DF08A2E.1090501@inkedblade.net>
To: Sylvain Galineau <sylvaing@microsoft.com>
CC: "www-style@w3.org" <www-style@w3.org>
On 06/09/2011 02:52 PM, Sylvain Galineau wrote:
>>
>> Because if my gradient has a fixed length (which is reasonably common for creating
>> edge effects via background-image), the "towards the top" interpretation would
>> place it at the bottom of the box.
>>
>> I think *that* is counter-intuitive.
>
> Sorry, not sure I follow. Can you elaborate ? Actual use-cases backing up the
> model is what we are definitely after since that is the only way to demonstrate
> it to be better than alternatives. Thanks!

Let's say I create a gradient like this:

   background: linear-gradient(left, blue, green);

This will create a gradient with blue starting at the left edge of the box
progressing to green on the right edge of the box.

Now suppose I create a gradient like this:

   background: linear-gradient(left, blue, green 10px);

This will create a gradient with blue starting at the left edge of the box
and progressing to green at 10px from the start of the gradient, i.e. at
the left edge of the box, and continuing as green until the right edge.

You're saying that "left" should mean "start at the right edge", so that
with the above code, I'd get a gradient that puts blue at the right edge
and starts green 10px from the right edge, placing the transition at the
right edge of the box.

I think that's counter-intuitive. I'd rather the keyword indicated the
start point of the gradient. And I think this behavior was way easier
to understand when
   linear-gradient(left, blue, green)
was merely a shorthand for
   linear-gradient(left to right, blue, green)
using the <position> to <position> syntax.

~fantasai
Received on Thursday, 9 June 2011 08:54:41 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:41 GMT