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

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

From: Alan Gresley <alan@css-class.com>
Date: Thu, 16 Jun 2011 15:25:48 +1000
Message-ID: <4DF993DC.1020306@css-class.com>
To: www-style@w3.org
On 16/06/2011 12:35 AM, Eli Morris-Heft wrote:

> In this syntax, it is made explicit that the single keyword is a shorthand
> for the whole thing. Then, if the author is inclined to use keywords but
> can't remember which direction a keyword represents, the author has the
> option to make their direction explicit by specifying the start and end
> point with keywords. (Also in this syntax, the use of an angle or keyword
> bit is no longer optional.)


So in other words, if I had a box of width: 200px and height: 100px, I 
can no have a linear-gradient (running from start to end) at 45 arc 
degrees from either the x or y axises.

FYI, a transition from top to right, right to bottom, bottom to left and 
left to top is inscribing the box. A transition from top right to bottom 
right, bottom right to bottom left, bottom left to top left and top left 
to top right is circumscribing the box.

So any transition from side (top, right, bottom and left) to corner (top 
right, bottom right, bottom left and top left) is also a transition from 
inscribing to circumscribing.

Considering that it takes some knowledge of geometry to draw a Octagon 
with a linear-gradient,

http://css-class.com/test/css/3/gradients/gradient-shapes.htm

(the length in pixels are set to the most sensible fractional minimum to 
prevent rounding issues) the calculations required to do the same on a 
regular polygon like a rectangle is no trivial matter. This is since 
lengths are rounded to the nearest pixels and _most_ side to corner 
transitions would fail due to this rounding.



-- 
Alan Gresley
http://css-3d.org/
http://css-class.com/
Received on Thursday, 16 June 2011 05:26:16 GMT

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