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

RE: [css3-background] color transition line

From: Brian Manthos <brianman@microsoft.com>
Date: Tue, 1 Nov 2011 04:15:25 +0000
To: fantasai <fantasai.lists@inkedblade.net>, "www-style@w3.org" <www-style@w3.org>
Message-ID: <9710FCC2E88860489239BE0308AC5D170440E177@TK5EX14MBXC264.redmond.corp.microsoft.com>
Also, I thought the spec was pretty clear on this topic in section 5.4:

http://www.w3.org/TR/css3-background/#corner-transitions
# The center of color and style transitions between adjoining borders
# is at the point on the curve that is at an angle that is proportional
# to the ratio of the border widths. For example, if the top and right
# border widths are equal, that point is at a 45 angle from the
# horizontal, and if the top is twice the width of the right the point
# is at a 30 angle from the horizontal. The line demarcating this
# transition is drawn between the point at that angle on the outer arc
# and the point at that angle on the inner arc.

IE9's implementation matches this conformance requirement.

In your sample (0005.html), it appears that you are using consistent width across all 4 sides of the border.  As such, the correct rendering would have a color split along 45 deg angle in the upper right corner.  Your first rendering looks like it might be matching that, but I didn't pixel verify.

While interesting to look at, the border-radius has no impact on the angle at which the color transitions.  That's been my understanding since the very beginning of working on CSS3 backgrounds in IE.  In fact we have internal test cases to verify that this doesn't break accidentally.


Has something changed since the spec went CR in February 2011 that necessitates revisiting this?

-Brian


> -----Original Message-----
> From: Brian Manthos
> Sent: Monday, October 31, 2011 9:03 PM
> To: 'fantasai'; www-style@w3.org
> Subject: RE: [css3-background] color transition line
> 
> Which image in the spec is this referring to?
> 
> Or perhaps a link to issue-189 could show me the way.
> 
> -Brian
> 
> > -----Original Message-----
> > From: fantasai [mailto:fantasai.lists@inkedblade.net]
> > Sent: Monday, October 31, 2011 8:55 PM
> > To: www-style@w3.org
> > Subject: [css3-background] color transition line
> >
> > ISSUE-189
> > The color transition line specified in CSS is wrong. See
> >    http://lists.w3.org/Archives/Public/www-archive/2011Jul/0005.html
> > and pick your favorite*!
> >
> > (The one in the spec is the third one, which is pretty obviously
> > wrong.)
> >
> > * Most people I've asked like the last one.
> >
> > ~fantasai
> >
Received on Tuesday, 1 November 2011 04:16:20 GMT

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