Should I still use vendor prefixes for border-radius?

3.9k views Asked by At

Currently, when I code I use:

-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;

But based on my tests, it didn't make any difference with any modern browser ( Chrome 33+, opera 25+, safari 8+). Internet Explorer 8 doesn't supports this property, but the vendor prefixes won't make any difference.

Is there any reason to keep them?

2

There are 2 answers

0
janhartmann On BEST ANSWER

Use http://caniuse.com/#search=border-radius for checking such

Conclusion: No need for adding vendor prefixes for border-radius, as its supported in all major browsers (and IE9+). If you really need border-radius in IE8 check out: How to apply border radius in IE8 and below IE8 browsers?

But in 99% of cases border-radius is not crucial to a design. Employ the technique of graceful degradation and leave IE8 with square corners

0
majick On

You can also add PrefixFree to your page to cover you in a few more cases than just border-radius, as it will add these prefixes for you to be safer.

And for backwards compatibility using CSS3 with older versions of IE there is PIE (again not just for border-radius but others) and you can just add this where you need it:

behavior:url('pie.htc');