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?
Yes, and there will always be, as it's kind of an industry standard that vendors use their prefix on newly drafted properties/methods until those become a standard.
Vendor prefixes are one way browsers use to give us CSS developers access to newer features not yet considered stable. Before going on keep in mind this approach is declining in popularity though, in favour of using experimental flags, which must be enabled explicitly in the user's browser.
CSS prefixes -webkit- (Chrome, Safari, newer versions of Opera, almost all iOS browsers including Firefox for iOS; basically, any WebKit based browser) -moz- (Firefox) -o- (old pre-WebKit versions of Opera) -ms- (Internet Explorer and Microsoft Edge)
For major browsers, the CSS prefixes are: -webkit- : For Chromium browsers like Google Chrome, Safari, Opera, Brave, etc. -moz- : For Mozilla Firefox. -o- : For the Older version of Opera Browser (You can safely ignore this prefix, as the number of users using this browser are very less).
Use the site http://shouldiprefix.com. It has the single purpose to "show what prefixes are needed for a newer CSS property."
Just enter the property you're interested in the search field, and it will return something like the below graphic:
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
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With