Le 17 sept. 2014 à 08:36, Tim Dawson <t...@ramasaig.com> a écrit :
> For the standards version I've got: > > background-image: linear-gradient(top, #1B91FF 60%, #FEC409 60%, #FEC409 > 100%); Uh, no, that should **not** work anywhere (see below). > it works perfectly in Firefox (32), but not in Chrome 37 (which I thought it > should ?) Do you happen to have a -moz- prefixed rule as well? Check the developer tools in Firefox, it will almost certainly show you that it uses the prefixed one, not the un-prefixed, standard one. > For the webkit version I've tried several variants on: > > background-image: > -webkit-gradient(linear, top, bottom, > color-stop(0, #1B91FF), > color-stop(60%, #1B91FF), > color-stop(60%, #FEC409), > color-stop(100%, #FEC409) > ); At a minimum, that should be -webkit-linear-gradient(); (and then same as the -moz- syntax; for very old webkit browsers, there is yet again a different syntax…) > I hope my error is only a small one, but can someone put me right, please ? Your error in the standard syntax is in the direction keyword. The correct syntax requires a “TO” (or in your case, a top-to-bottom gradient, you can omit the direction keyword altogether, as top-to-bottom is the default). So the correct syntax is: background-image: linear-gradient(to bottom, #1B91FF 60%, #FEC409 60%, #FEC409 100%); That works in IE 10+, Firefox 24+, Safari 6.1+, bink based browsers. http://www.w3.org/TR/css3-images/#linear-gradients (yeah, the evolution of that syntax for gradients has been a complete mess, and ended in something more complicated and harder to read than should be) Philippe -- Philippe Wittenbergh http://l-c-n.com/ ______________________________________________________________________ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
