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

[css3 images] WD gradients review notes

From: Brian Manthos <brianman@microsoft.com>
Date: Thu, 8 Sep 2011 20:09:09 +0000
To: "www-style@w3.org" <www-style@w3.org>
Message-ID: <9710FCC2E88860489239BE0308AC5D1715998D@TK5EX14MBXC266.redmond.corp.microsoft.com>
http://www.w3.org/TR/css3-images/#gradients

No major issues.


5.2.1, prose in the "Color-stops are placed..." paragraph
# Negative distances are allowed in a radial gradient and work
# the same as in linear gradients with respect to setting the color
# of the gradient-line, but colors before the starting-point of the
# gradient-line are not displayed.

A. I think of them as "locations" not "distances".  I'm not married to it, but I find the term "distances" confusing in this context.
B. My interpretation of this phrasing suggests that "negative distances" in a linear gradient *are* displayed.  I'd like to see an example where that is the case.


5.4, Example XX
This example is inconsistent in the number of equal signs between pre and post "fixed-up" examples.  That's not an inconsistency worth quibbling about.  But, upon noticing that I hit upon another thought...

C. Consider replacing  "==" and "===" with "=1=>", "=2=>", "=3=>", "=12=>", "=13=>", "=123=>", and "=23=>" to explicitly indicate which rule(s) were involved in the conversion.


5.4, Example XX
# 4. linear-gradient(red -50px, white, blue)
#   ===
#   linear-gradient(red -50px, white calc(-25px + 50%), blue 100%)

D. This is the first and only reference to calc() within the context of gradients in the entire module.  I'm fuzzy on whether we consider the examples normative or not.  Either way, it would be good to be explicit somewhere in the module regarding how calc() percentages should behave.

My understanding is that gradient calc percentages resolve as follows ...
D1. <color-stop> (all 4 flavors): percentages resolve relative to the length of the gradient-line (segment)
D2. <angle> (both linear flavors): percentages invalid
D3. <position> (both radial flavors): match background-position behavior
D4. <length> (both radial flavors): the same as <percentage>
D5. <percentage> (both radial flavors): the same as without the calc() wrapper


5.4, first Note
# For example, the rule 'background-image: linear-gradient(red, yellow 100px, blue 50%)'
# would work as expected as long as the background area is at least 200px tall.

E. I find the phrasing "as expected" confusing here, rather than helpful.  If implemented correctly by the UA, everything should work "as expected".  Recommend replacing "work as expected" with "require no fix-up".
Received on Thursday, 8 September 2011 20:09:45 GMT

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