-moz- /* Firefox and other browsers using Mozilla's browser engine */ -webkit- /* Safari, Chrome and browsers using the Webkit engine */ -o- /* Opera */ -ms- /* Internet Explorer (but not always) */
These browser prefixes are needed as the browsers experiment and test out their implementations of the newer CSS3 properties. Sometimes all the prefixes are not always needed, but it usually does not hurt to include them, as long as you make sure to put the non-prefixed version last.
-moz-border-radius: 10px; -webkit-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px;
There are several reasons why this is important, but I’m not going to get into that here. Just make it a rule to always include the non-prefixed version and put it at the end.
Some properties are so far along in development, that some browsers are dropping the prefix. Border-radius is one property that is pretty well developed at this point. The latest versions of major browsers all seem to support it without the vendor-prefixes. Keeping them in the code, however, allows you to make sure users who don’t update their browsers, will still be served.
Internet Explorer 9 supports many (but not all) of the favorite CSS3 properties. You can use border-radius without any vendor-prefix, for example.
If you install it in your site, you can add this code after your other defintions: