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

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

From: Brian Manthos <brianman@microsoft.com>
Date: Fri, 17 Jun 2011 00:40:58 +0000
To: Brad Kemper <brad.kemper@gmail.com>, Tab Atkins Jr. <jackalmage@gmail.com>
CC: fantasai <fantasai.lists@inkedblade.net>, "www-style@w3.org" <www-style@w3.org>
Message-ID: <9710FCC2E88860489239BE0308AC5D170397DA@TK5EX14MBXC264.redmond.corp.microsoft.com>
Brad Kemper:
> It's not intuition that is influencing their answers, it is the subtle suggestion
> that their answer to what 'left' means should be linked to their
> understanding of what '0deg' means. That's the the very thing that I disagree
> with.

Yes, there should be linkage.  Below is just one example.  With transitions and animations, it gets even more likely you'll be comparing red apples to green apples *often*.


Background-image:
linear-gradient(90deg, rgba(255,0,0,0.5), rgba(0,0,255,0.5)),
linear-gradient(left, rgba(255,0,0,0.5), rgba(0,0,255,0.5));

With the 1.107 spec, this produces (something like) 75% alpha red (left side) to 75% alpha blue (right side):
	Background-image:
	linear-gradient(90deg, rgba(255,0,0,0.5), rgba(0,0,255,0.5)),
	linear-gradient(left [to right], rgba(255,0,0,0.5), rgba(0,0,255,0.5));

With the 1.108 spec, this produces a consistent coloration:
	Background-image:
	linear-gradient(90deg, rgba(255,0,0,0.5), rgba(0,0,255,0.5)),
	linear-gradient([right to] left, rgba(255,0,0,0.5), rgba(0,0,255,0.5));

My point is not about the example, but that you can and should be able to compare and contrast multiple linear-gradient specifications with a single mental model.
Received on Friday, 17 June 2011 00:41:36 GMT

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