Do we need box-shadow or border-radius prefixes anymore?

Straight forward question by Jay Hughes:

@chriscoyier Do we need -moz and -webkit prefixes anymore on popular items such as border radius and box shadow? Is there a post abt this?

— Jay Hughes (@graphicsjay) November 28, 2012

I didn't specifically have a post about this, so let's do it!

Short Answer

Specifically for box-shadow and border-radius, probably not.

You only need them if:

1. It's a rare situation where the square-corner or no-shadow fallback hurts the experience.
2. And your site has significant traffic of Firefox 3.6-, Safari 4-, iOS 3.2-, or Android 2.3-

Long Answer

Let's explore a bit deeper. First, you can see exactly what browsers support what features at Can I use....

Second, you should only make decisions about feature support based on statistics from your own site and nothing else.

border-radius

Firefox 3.6- needs -moz-. From 4 up, unprefixed is fine. On this site, that's 0.3% of the 30% or so that use Firefox.

Safari 4- needs -webkit-. That's even smaller for this site. 0.1% of the 10% or so using Safari.

iOS 3.x needs -webkit- too, which means an iPhone 3GS or iPad 1 that have never been upgraded, which is the smallest number yet.

Again, it's your sites stats that matter, but I'd guess most sites are well under 1% for all this combined.

Not to mention, a non-rendering border-radius is the poster child for "who cares" fallbacks.

box-shadow

Box shadow is similar but slightly more strict. Exactly the same for Firefox and iOS. Safari needs -webkit- in 5.0-, but was fixed just three months later in 5.1 (which shipped with OS X 10.7).

The most significant difference is that Android 2.3 needs -webkit-. Even on this site I'm looking at 0.5% which is way higher than those other browsers. If you're site is specifically mobile-y, I bet this number is much higher.

It's likely that the fallback of not having box shadows is no big deal, but I have seen a situation where it mattered so hey.

Do we need box-shadow or border-radius prefixes anymore? is a post from CSS-Tricks

Source : internetwebsitedesign[dot]biz