RE: [css3-image] gradients from color to full alpha transparency (was Re: [CSS3] support for linear-gradients & radial-gradients)

> From: Alan Gresley [mailto:alan@css-class.com]
> The crux of the propose change is that <color> to 'transparent' will
> not
> behave as <color> to rgba(0,0,0,0) (the current behavior of 1E10,
> Gecko,
> WebKit and Opera) but from <color> to rgba(255,255,255,0) which is the
> behavior that IE10 has for such gradients. Also the current gradient
> from <color> to rgba(0,0,0,0) are supposed to be changed, thus my half
> life gradient scaling.

Transparent white has problems as well.

In the example below, only boxes D and H have the desired premultiplied-interpolation-like rendering (in IE 10 Preview 1).
- A, E, C, and G are too light.
- B and F are too dark.

-Brian



<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=10"/>
<style>
table {
 border: 1px solid red;
 color: black;
 font-size: 48pt;
}
td {
 border: 1px solid blue;
 width: 50px;
 height: 100px;
}
tr:nth-child(2n) {
 background-color: black;
 color: white;
}
td:nth-child(1) {
 background-image: -ms-linear-gradient(red, transparent);
}
td:nth-child(2) {
 background-image: -ms-linear-gradient(red, rgba(0,0,0,0));
}
td:nth-child(3) {
 background-image: -ms-linear-gradient(red, rgba(255,255,255,0));
}
td:nth-child(4) {
 background-image: -ms-linear-gradient(red, rgba(255,0,0,0));
}
</style>
</head>
<body>
<table>
<tr>
<td>a</td>
<td>b</td>
<td>c</td>
<td>d</td>
</tr>
<tr>
<td>e</td>
<td>f</td>
<td>g</td>
<td>h</td>
</tr>
</table>
</body>
</html>

Received on Sunday, 26 June 2011 20:30:25 UTC