A good javascript framework which adds CSS3 support to IE6-8 & missing CSS3 in IE9?

Question

I am surprised that the release version of IE9 is missing support for some more basic CSS3 elements like text-shadow and border-image.

What's the most comprehensive JavaScript framework for adding/emulating CSS3 elements to IE6-9 instead of using a bunch of smaller frameworks like ie-css3, CSS3PIE, Modernizr, html5shiv,... etc?

I am sure there's no single framework that does it all but I am looking for the closest.

Answer 1

What? You're suprprised that IE doesn't follow standards? When will people learn...

Try Selectivizr. From the website: "selectivizr is a JavaScript utility that emulates CSS3 pseudo-classes and attribute selectors in Internet Explorer 6-8. Simply include the script in your pages and selectivizr will do the rest." I don't know what's the support of IE9 but it should be much easier than IE6 so I guess it should work fine.

You will still need some of those "smaller frameworks" though, because they do what they do just fine, they are small enough, so there's no point in reinventing the wheel just for the sake of having one big framework instead of few smaller ones. It's hard to make a one-size-fits-all framework so that's why you have some diversity, and I think it's a good thing.

But don't expect that you'll just include some library and all of the browsers will get flawless CSS3 support because that's not gonna happen any time soon.

If you want advanced effects that would work consistently across all of the browsers from IE6 then I would recommend using Raphaël. It uses VML on IE and SVG on other browsers. The API is also simpler than CSS, but that is of course a matter of taste. But even if not the API, it's pretty hard to beat the argument that you can have rounded corners and other goodies that look the same on Firefox 3.0+, Safari 3.0+, Chrome 5.0+, Opera 9.5+ and Internet Explorer 6.0+ without using images.