Serving different CSS presentation to different browsers, or having browsers download additional css they can't use only to end up with a presentation that differs between browsers or having to use a jQuery implementation anyway for browsers that do not support the webkit hacks would be an large additional investment of your time to write and maintain with little payout.

I control for my sites to degrade gracefully on the JavaScript enabled\disabled axis, why would someone want to invest additional resources in creating a CSS degradation axis that might conflict with JavaScript and be much harder to predict and control the display output due to browsers updates?

I know this is wishful thinking, but here's a solution: Stop worrying about pixel-perfect websites across browsers?

As developers, we degrade gracefully if JavaScript is disabled. How about, instead, we degrade gracefully if the visitor is using IE6?

If a visitor using IE6 views my site and they see boxy divs versus others who see rounded corners, does it take away anything from the IE6 visitor? They're still seeing the content (which, hopefully, is the main purpose of their visit!)

Obviously, this isn't a solution for everyone (and seriously, wishful thinking, hah!)

So for my actual response: You're absolutely right. I'm not arguing we start implementing a CSS3 solution along with a JS solution today. This demo (along with other css3 articles) isn't about today. It's about tomorrow and the future of the web.

However, if we keep catering to older browsers, what's their incentive to upgrade?? Sure, we could throw a JS hack together to get all browsers to function the same, but why? (sorry, wishful thinking again!)

I do commend you on degrading gracefully. Many developers simply don't. And just to point out, I completely understand where you're coming from. Good day!

because a lot of people wouldnt go to the bother of using fully fledged javascript solutions for a tiny visual flourish.

most of these css techniques degrade very very well and are incredibly simple to implement, if it is a "this site MUST have this animation", then best to go down the jquery route, if its a "this will be nice to add" then doing it in css3 only saves a ton of bother.

>daleharvey: most of these css techniques degrade very very well

>j79: In addition (since you mention compatibility), adding this to a site wouldn't "break" it

The linked page looks like shit in Internet Explor 6,7, and 8 and is completely unviewable in Opera due to masking errors. It degrades horrendously and I would consider it broken.

You're right, it does. But in fairness, it's a demo for webkit browsers. I'm guessing the author wasn't too concerned for IE.

If the demo page was something super simple like:

#links{ -webkit-transition-duration: 0.5s; } #links:hover { color: red; }

Super simple and it wouldn't break anything.

Basically, just because the author didn't consider IE users on a Webkit demo doesn't mean CSS3 is broken (or doesn't degrade properly.)