CSS compiler + ie gradients = strange behaviour

[Peter Willert]

Hi GWTlist,

we are getting strange css compile behaviours with special styles for
ie7 and ie8.

Our goal is to get css for gradients in IE7 and IE8 into our css
files. That works fine for webkit or firefox but fails when it comes
to more complex strings for IE7 and IE8.

For this we have the following setup (looks quite complicated but fits
our needs, until now ;-)):

A ColorDefinition file:
..
private static String COLOR1 = "#32333D";
private static String COLOR3 = "#000000";
..

______________________________

A PlatformStyle file to build some strings to be used later in CSS
files:

public String getPrimaryGradientWebkit() {
return "-webkit-linear-gradient(top, " + color1 + ", " + color3 +
")";
}

public String getPrimaryGradientIE8() {
return
"\"progid:DXImageTransform.Microsoft.gradient(startColorstr='"
+ color1 + "', endColorstr='" + color3 + "')\"";
}

public String getPrimaryGradientIE7() {
return
"progid:DXImageTransform.Microsoft.gradient(startColorstr='"
+ color1 + "', endColorstr='" + color3 + "')";
}

______________________________

And finally a css file:
.header {
/* style above... */
background-image: primaryGradientWebkit; /* Chrome 10+, Saf5.1+ */
-ms-filter:: primaryGradientIE;
filter:primaryGradientIE7;
}

______________________________


The output for webkit is "background-image: -webkit-linear-
gradient(top, #32333D, #000000)". Yay!
The UNEXPECTED output for IE7 is "filter:primaryGradientIE7", so we
got nothing that can be interpreted as style, IE8 gets the same
"filter:primaryGradientIE8",.

We would EXPECT something like this for ie7:

"filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#32333D',
endColorstr='#000000')"


Question:
Maybe somebody knows something like that, or have a good starting
point to get to the root of that
problem?

Any help appreciated...

Thanks,
Peter

[Jeff Larsen]

How about you check out http://css3pie.com/

[Peter Willert]

Hey Jeff,

thanks for your fast reply!

Am Donnerstag, 11. August 2011 19:12:14 UTC+2 schrieb Jeff Larsen:

How about you check out http://css3pie.com/

We know about solutions like that, but we don't like to inject any new dependencies into our project.

Unless there are workarounds, we think it should work like we've implemented that stuff. Otherwise: 
a) we've done anything wrong, or
b) we found a gwt css compiler bug

Are there any other hints? :)

Thanks,
Peter