Is there a list of all properties that need prefixes?

Asked

Viewed 541 times

4

I have a question about CSS:

To run in different browsers you need to use the prefix before the property, for example: -webkit-boder-left-rarius: 3px;.

But which CSS Styles as border, margin, transition and so I should use the prefixes? Have any list?

  • Mixins. Has in Css-Tricks. https://css-tricks.com/snippets/css/useful-css3-less-mixins/

2 answers

3


Prefixes are used to implement some items that are not compatible with other browsers, but exist within a specific browser.

But a lot of the CSS elements don’t need prefixes and some that need prefixes no more.

Ex. border-radiusit is very stable in all browsers other than the backdrop-filter that only exists in the Safari Webkit for iOS 9 and needs a -webkit-backdrop-filter

How to find out if you need to use the prefix or not?

You can consult the kennel it is very easy to use, just put the element you want to use and see which browsers are compatible. It has an icon indicating when the property needs the prefix.

Although this approach is more laborious than using a generator, if you are learning it is the best way to get to know the evolution of CSS 3.

2

  • Can you tell me if there is a similar one for Grunt? I use Grunt for the compilation with my Sass code using Compass as well. Normally I use Compass to set the prefix. But if you have a more automated flow directly in the build, it would be better.

  • 1

    I never used it, but you can test this one: https://github.com/nDmitry/grunt-postcss

Browser other questions tagged

You are not signed in. Login or sign up in order to post.