0

I've been experimenting with css3 radial gradients and came up with a nice looking gradient:

background-image: -webkit-radial-gradient(center 110%, 80% 100%, transparent 20%, #22853D);

Now, I am trying to make it cross-browser. What would be the equivalent of the above for the old -webkit-gradient('radial') syntax?

UPDATE Simply put it, it is possible to draw an ellipse with the old syntax?

Dziamid
  • 11,225
  • 12
  • 69
  • 104

1 Answers1

0

Unfortunately this is not possible. You could apply a circular radial gradient and then squish it through css transformations, as here: CSS3 Radial Gradients with RGBA() but I wouldn't recommend this approach.

I'd recommend using SVG backgrounds, you can generate your own gradient at Microsoft's website:

http://ie.microsoft.com/testdrive/graphics/svggradientbackgroundmaker/default.html

It provides excellent coverage across all browsers (they only blind spot being Firefox 3.6).

Community
  • 1
  • 1
methodofaction
  • 70,885
  • 21
  • 151
  • 164