What is meta? ×
Meta Stack Exchange is where users like you discuss bugs, features, and support issues that affect the software powering all 127 Stack Exchange communities.

I'm wondering if there's a guideline for answering CSS questions in regards to prefixing properties and values with vendor prefixes. I realize that vendor prefixes become unnecessary over time, and in fact become deprecated and dropped after a long period of time (as is the case with some -moz properties), but I'm referring to answers to questions at the time when the answer is posted.

I've been seeing answers with and without prefixes, and some with prefixes that have already been unprefixed for a while:

-webkit-box-sizing: border-box; /* not necessary since Chrome 9 */
-moz-box-sizing: border-box; /* still necessary */
box-sizing: border-box;

And then there's people who blindly prefix everything. For Trident, some values just work in IE 10 and using a prefixed value (or property) will not bring backwards compatibility to IE 9 (for instance there is no -ms-radial-gradient)

Occasionally I still see border-radius being prefixed with -webkit and -moz, even though the standard property has been supported since Chrome 4 and Firefox 4, and Firefox 13 will throw a warning upon seeing the -moz prefix.

I think we can all agree that the -khtml prefix is obselete, as it is supported only by Safari <= 2 and Konqueror, for properties that existed in test at that time I assume. Luckily I don't see any answers with that.

Worst of all is the -o prefix, which still comes up rather frequently.

Of course, none of this applies if the question targets a specific version of a browser.

What's the community's take on this?

share|improve this question
add comment

1 Answer

up vote 6 down vote accepted

Disclaimer: I'm the top answerer for all time in the tag, but this is just my personal take. There's no official or de facto guideline on this issue, but this answer may help someone.

Personally, when answering CSS questions, I try to follow the prefixes used in the question, removing any totally unnecessary ones, like the -ms- ones that you've pointed out, and explaining my decisions accordingly. This is just part of my own policy to follow the question where it doesn't hurt to, for the sake of the asker.

If I'm writing new code in an answer, I use the prefixed version of a property if the latest version of a browser at the time of writing still requires or recommends it. If the property is slated to be included in a standard I will include the unprefixed version last, for obvious reasons. So for example if I'm writing new code that makes use of border-radius, I leave out the prefixes completely, because in this day and age there is no need to prefix it (unless the question has a specific and valid reason to support an older browser that otherwise needs the prefix).

I automatically downvote any answer that blindly prefixes everything, just as I automatically downvote any answer that suggests using !important without explaining why.

I also automatically downvote any answer that makes use of only a single prefix across a snippet of CSS that can be used by more than one vendor if only the rest of the prefixes were included (e.g. if it's something that's on track to be standardized and not something invented by a sole proprietor).

Again, this is just my take on the issue. My advice to everyone is to use your best judgement, and in fact, any semblance of judgement for that matter when writing code. The stuff I say I downvote for is the kind of stuff you wouldn't be doing if you were paying attention at all.

When in doubt, http://caniuse.com is an excellent reference for figuring out which versions of which browsers require prefixes for certain CSS properties.

share|improve this answer
Heh, found a question I answered where I basically called out the question's code for blindly prefixing things. At least it wasn't the asker who wrote that code. –  BoltClock's a Unicorn Aug 27 '13 at 18:51
Oh and the most egregious example of using prefixes that were completely unnecessary that I can find is one of using all the component properties of border-radius and -moz-border-radius, and not even the shorthand ones. –  BoltClock's a Unicorn Aug 27 '13 at 18:53
Not everyone has the luxury of supporting only the latest crop of browsers. There are some poor saps out there who still have to support IE 6 and 7. So vendor-specific prefixes, required to make older versions of Chrome, Safari, and Firefox behave the way the designer intends, are unfortunately not something that can be avoided in the real world. But I see it like debugging/error-checking code: there's no reason for it to be included in an answer unless it is actually relevant to the question. Otherwise it is just needless clutter. –  Cody Gray Aug 28 '13 at 7:23
add comment

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .