Let's talk about vendor prefixes. In this section, we'll talk about browser support for flexbox and how we should add vendor prefixes to our flexbox CSS in order to get deeper flexbox support. We'll also talk about something called Autoprefixer, which helps us add those prefixes.
Flexbox support starts at IE10 and later version if we use the -ms- vendor prefix. But this might not be the only vendor prefix you want to add since the W3C specification has actually changed since it was first implemented in browsers. When it was implemented, the syntax and property names were different from that they are today. To get deep browser support, we can use an older syntax combined with the newer syntax to support some of the early adopting browsers.
Let's update our original ruleset where we first added flexbox, which was our .columns:
.columns {
display...