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

Re: [css3-images] Summary of recent gradient issues

From: Brad Kemper <brad.kemper@gmail.com>
Date: Fri, 17 Jun 2011 09:15:53 -0700
Cc: "Tab Atkins Jr." <jackalmage@gmail.com>, Brian Manthos <brianman@microsoft.com>, Simon Fraser <smfr@me.com>, www-style list <www-style@w3.org>
Message-Id: <7CD422A9-3630-4880-96A4-27E50600153D@gmail.com>
To: divya manian <divya.manian@gmail.com>

On Jun 17, 2011, at 7:02 AM, divya manian wrote:

> On Thu, Jun 16, 2011 at 5:57 PM, Tab Atkins Jr. <jackalmage@gmail.com> wrote:
> That sounds pretty good.  So we'd have:
> linear-gradient(to top right, black, white)
> being in the same direction as:
> linear-gradient(45deg, black, white)
> I think it is a mistake to tie degree representation of the gradient line to the keyword representation of it. Keywords solve the problem of getting gradient lines diagonal to the box they are on but do not serve any other purpose.

That is exactly right.

So we could avoid redundancy by just adding a keyword that meant "this angle should conform to box shape" (as with my 'as-square' keyword), or "this angle should go to a corner only". (Tab's 'snap' idea). But I think it would by very confusing for things like '89deg snap' to snap to a corner instead of a side. And there are only 4 corners, so with 'snap' most people would probably just get in the habit of using the 4 angles that are 45deg from horizontal or vertical ('45deg snap', '135deg snap', '225deg snap', '315deg snap', or the negative equivalents), or perhaps of just using angles that are 1deg off from multiples of 90deg ('89deg snap', '91deg snap', etc.) and I think that would be difficult to intuit without reading the spec. So we might as well just use four keywords.

> As such, my view is keywords should not be considered to possess an equivalent radial representation and the spec should make this clear.

I think the spec was clear on how the keywords worked, but a couple people didn't find it intuitive.

> I also think CSS authors are familiar by now of the top, right, bottom, left keywords. This intuitively suggests the beginning position. Using the 'to' keyword would beg the question, why there is no equivalent 'to' keywords elsewhere in CSS (also should there be a 'from'?). I think it introduces additional complexity that could be avoided. 
> In my view, this:
> linear-gradient(top left indianred, 50% midnightblue, right mistyrose); 
> would be something that would be understandable, given we make similar assumptions of default keyword values for background-position http://dev.w3.org/csswg/css3-background/#the-background-position

Exactly. I made this point once before. Another example is 'vertical-align:top' versus 'vertical-align:5px'. With the unit measurements, it is understood to be "from the baseline". With the keywords, it is essentially "from the edge described by the keyword" (as in linear-gradient working draft). I've never heard of this causing even the slightest confusion, and I rather have consistency with these than to try to build in some sort of new link between the starting alignment keyword and the unit measurements. 

Far more confusing is trying to understand the difference between 'vertical-align:top' vs. 'vertical-align:text-top'. If you can learn that, then you can also learn that 'left' is a starting position for linear-gradient and not an end position.

Received on Friday, 17 June 2011 16:16:24 UTC

This archive was generated by hypermail 2.4.0 : Friday, 17 January 2020 22:50:02 UTC