vendor-prefix

I guess most of us are used to write common CSS3 properties with vendor specific prefixes to support all browsers, so it's not uncommon to see something like this: border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; -o-border-radius: 6px; I recently noticed that on most common properties the prefix is not required any more. And given the rapid update cycle of current browsers, I started to think about the necessity of keeping the prefixes - e.g. there probably are not many versions of Chrome still in the wild that do not support the native border-radius syntax. Also I've

The most common features I remember needing prefixes for were features such as flexbox , border-radius , box-shadow , etc... but now they are supported. With more users switching to more powerful browsers like Chrome and Firefox and away from IE, are there still features now that haven't been fully supported and require prefixes? There is a great site which allows you to check out support of any css property by most modern browsers. It also shows info about vendor prefixes (if they are needed). This site is named "Can I use" - http://caniuse.com Use the site http://shouldiprefix.com . It has

Possible Duplicate: Why do browsers create vendor prefixes for CSS properties? For example, if I have an image that I'd like to rotate, why does Google Chrome do nothing when I use transform: rotate(50deg); but work fine when I use -webkit-transform: rotate(50deg); ? Isn't the whole point of having the standard to make it so that a programmer/designer only writes the same code once, and not once for each of the browsers? Is this something that is going to be changed in the foreseeable future or will it always be this way? I'm only just starting to use CSS3 and this seems really bizarre to me.

CSS properties in React are not automatically added with their vendor prefixes. For example, with: <div style={{ transform: 'rotate(90deg)' }}>Hello World</div> In Safari, the rotation wouldn't be applied. How do I get that accomplished? zealoushacker React does not apply vendor prefixes automatically. In order to add vendor prefixes, name the vendor prefix as per the following pattern, and add it as a separate prop: -vendor-specific-prop: 'value' becomes: VendorSpecificProp: 'value' So, in the example in the question, it needs to become: <div style={{ transform: 'rotate(90deg)',

As the title states I was wondering if this should be used. According to MS documentation simply using "animation" is now the default for IE10 (which is why i had a green squiggle) After looking this up and fixing it, I wondered, should I still include this line "-ms-animation" Can anyone say if it is needed for older browsers, or did removing the need for an "-ms" prefix apply retroactively? The -ms- prefix was required for animations, transitions, gradients and font-feature-settings in pre-release versions of Internet Explorer 10. The Release Preview and stable version of IE10 support all of

I have a website which I support as far as IE8, no further. When I first launched the site, I decided to use CSS vendor prefixes for CSSs elements such as border-radius, box-shadow etc. I did this from a complete noob standpoint. However, is a better approach not to use them and simply let browsers catch up rather than patch up for the sake of uniformity? No, you shouldn't remove all of them, however you may as well remove the ones which are no longer required. How can I find out which prefixes are no longer required? Can I use... is a great resource for checking browser support for various