Advice From the CSS Guru: Embrace Prefixes

Vendor-specific CSS prefixes have been popping up in all the shiny and fancy CSS 3 demos of late. Microsoft IE 9, Firefox and Safari have all been using them to show off their latest CSS tricks, and you've probably already formed an opinion about them.

Web purists scoff at prefixes, since they add to the amount of coding and testing required just to get something to show up consistently across browsers. Repetition and bloat aren't welcome in this camp. But those who live on the bleeding edge see them in a different light.

In his latest piece for A List Apart, noted CSS scholar Eric Meyer argues that vendor-specific prefixes should be welcomed, not reviled: "We ought to praise vendors for using prefixes, and indeed encourage them to continue," he writes.

Meyer's argument is simple. Coding a stack of prefixes into your CSS is not ideal, but it's better than the alternative of using inconsistent CSS hacks or having to sniff for user agents to serve up totally different styles to different browsers.

He also argues that, "prefixes should become a central part of the CSS standardization process... I believe that prefixes can actually accelerate the advancement and refinement of CSS."

And it makes sense. Consider the author working with some brand new CSS property. At this point in its young life, all of the browsers are implementing the property, but all are doing so differently. The author can use the property – with prefixes – and gain the utility of whatever magic that CSS property is supplying without having to worry about their pages breaking in such-and-such browser.

These temporary hacks dwindle over time, Meyer writes.

As time goes on and implementations become consistent, browsers will drop the prefixes. From then on, authors will be able to write one line for border-radius instead of six-plus lines of CSS. Without them, we’re just waiting for the next botched implementation that forces us to support it through hacks for years upon years.

Definitely check out the whole article. It draws some interesting conclusions. Meanwhile, how do you feel about prefixing in CSS? Does it bother you, or do you agree with Eric that the practice will only make everything more interoperable in the future?

See Also:

• Dealing With Browser Differences in CSS 3
• Handy Guide to Detecting Support for HTML5
• A Universal Solution for Rounded Corners in Your Designs