Vendor Prefixes

CSS vendor prefixes, also sometimes known as or CSS browser prefixes, are a way for browser makers to add support for new CSS features before those features are fully supported in all browsers.

Using a tool like an online tool like autoprefixer can determine what prefixes need to be added. Example:

1
2
3
4
5
6
7
8
9
10
.example {
flex-grow:1;
}

// recommended to be
.example {
-webkit-box-flex:1;
-ms-flex-positive:1;
flex-grow:1;
}

This is using recommendations from [https://caniuse.com/#search=CSS%20Flexible%20Box%20Layout%20Module](https://caniuse.com/#search=CSS Flexible Box Layout Module)

Prefix Browser Relationship

1
2
3
-ms                ~ IE
-webkit ~ Chrome, Safari
-moz ~ Firefox

References