CODEWITHSUNDEEP
safaricssradial-gradients
coure2011
coure2011

Reputation: 42464

Why is webkit radial gradient not working in Safari?

This is working in Chrome but not in Safari:

background: -webkit-radial-gradient(center, ellipse cover, #fdfdfd, #d3d3d3);

How can I fix it for Safari?

Upvotes: 4

Views: 7064

Answers (2)

Lea Verou
Lea Verou

Reputation: 23907

It doesn't even work correctly in Chrome, as it shows a circular gradient, not an elliptical one. It does work correctly in Webkit nightlies.

The reason it doesn't work in Safari is that the syntax hasn't propagated yet to a stable version of Safari. Eventually it will. You need to learn patience my young padawan :)

For now, you may use -webkit-gradient, but always include the -webkit-radial-gradient equivalent after it. And while we're at it, don't forget the other prefixes too (-o-,-moz-,-ms-)

Upvotes: 4

Iurii Tkachenko
Iurii Tkachenko

Reputation: 3189

Try using for Safari:

background: -webkit-gradient( radial, <point>, <radius>, <point>, <radius>[, <stop>]* ) <color>;

Examples and more explanation can be found here: http://www.the-art-of-web.com/css/radial-gradients/

Upvotes: 3

Related Questions