Do we have to use non-standard/browser specific CSS vendor prefixes anymore?
It really depends on which features and which browsers you want to fully support. Even now some browsers are lagging. Here is a really excellent guide: http://caniuse.com/
It really depends on which features and which browsers you want to fully support. Even now some browsers are lagging. Here is a really excellent guide: http://caniuse.com/
I don’t know of any library that does this, but if they are all just prefixes–that is, there is no difference in name or syntax–writing a function yourself would be trivial. function setVendor(element, property, value) { element.style[“webkit” + property] = value; element.style[“moz” + property] = value; element.style[“ms” + property] = value; element.style[“o” + property] = … Read more
These are the ones I’m aware of: -ms- Microsoft mso- Microsoft Office -moz- Mozilla Foundation (Gecko-based browsers) -o-, -xv- Opera Software -atsc- Advanced Television Standards Committee -wap- The WAP Forum -webkit- Safari, Chrome (and other WebKit-based browsers) -khtml-, -konq- Konqueror browser -apple- Webkit supports properties using the -apple- prefixes as well prince- YesLogic -ah- Antenna … Read more
Update: LESS >= 1.6 As of version 1.6 (see changelog) property name interpolation is implemented in LESS. So you don’t need any magic anymore. (For older versions, see my original answer.) Your mixin would work basically as is: LESS: .vendor(@property; @value){ -webkit-@{property}: @value; -moz-@{property}: @value; -ms-@{property}: @value; -o-@{property}: @value; @{property}: @value; } /*example*/ .test { … Read more
As @zeroflagL wrote it appears that since jQuery 1.8.0 .css() does add browser specific prefixes (see this). In earlier versions this is not done automatically by jQuery’s .css(). You will have to do it by yourself or you can use jQuery’s .cssHooks() to add vendor prefixes. Code example from here: (function($) { if ( !$.cssHooks … Read more
The best practise is undisputedly to have the unprefixed property last: .foo { -moz-border-radius: 10px; /* Mozilla */ -webkit-border-radius: 10px; /* Webkit */ border-radius: 10px; /* W3C */ } Whichever is last out of -webkit-border-radius and border-radius will be the one that’s used. -webkit-border-radius is the “experimental” property – the implementation may contain deviations from … Read more
Although the syntax for vendor extensions is mentioned in the CSS3 Syntax module and introduced into the grammar to allow vendors to implement their own prefixes ignoring the standard, the actual vendor extensions themselves are not recognized as official CSS properties. This is not going to change, as they’re proprietary and specific to the vendors … Read more
It’s because the features were implemented by vendors before the specification reached its final release stage. The vendor prefixes ensure that there are no clashes with changing functionality etc. Originally, the point of vendor prefixes was to allow browser makers to start supporting experimental CSS declarations. Let’s say a W3C working group is discussing a … Read more