What am I exactly looking at here? From my research, and please correct me if I’m wrong, it looks like -webkit-box;, -moz-box;, -ms-flexbox; & -webkit-flex; are all just different syntaxes used by older browsers?

If I want to use flexbox and make it supported across browsers, it looks like I will need to write each individual CSS property: value; in five different syntaxes?

Say I’m using the property:value; flex-direction: row;, will I need to write it for -webkit-box;, -moz-box;, -ms-flexbox; & -webkit-flex; ? Do these different syntaxes all use the equivalent flex-direction: row; combination or does flex-direction: row; only work with certain syntaxes?

Yes, I’m a little confused

If anyone can bring light to this topic or point me in the direction of resources that do, I would be jubilant.

Yeah flexbox isn’t supported without vendor prefixes yet (and on older Safari versions, it barely works ugh). So you do need to write it that way if you want maximum support. The good thing is that you can use Autoprefixer which will directly do all the work for you. If you’re on Codepen, you can enable it in CSS options. If you’re working locally, you should probably use gulp to do it on compile, or manually do it online.

There’s also Flexibility which is a polyfill for older browsers, but it should still be accompanied by Autoprefixer. So yeah, use autoprefixer.

@imtoobose@JacksonBates Thanks to both of you guys. Wow… I didn’t know what I was getting into. Ok, I’ll use Codepen for now however I would prefer to install Autoprefixer on Sublime Text. Then I run into suggestions that I might as well install postCSS which includes Autoprefixer and a bunch of other goodies. In order to do this, I need to install Gulp. Gulp install looks like it requires some knowledge of command line which at this point I have zero. How would you suggest installing Autoprefixer or postCSS so that I can use it with Sublime Text. Is this stuff over my head? Yes. But this is how I role.

I used to use the Autoprefixer plugin for Sublime which gives you a single command to prefix your file. From what I remember though, it doesn’t give the same results as the regular Autoprefixer, and that’s why I ended up using the online tool before moving to Gulp…

If you want an automated build, install node and use npm to install gulp-cli globally. Then I can give you a gulpfile + package.json for it, which should be simple because I’ll just need to delete a bunch of lines from the ones I use for front end work.

@imtoobose Sounds great. I think I’ll go ahead and use Autoprefixer online so I can focus on my Personal Portfolio project. I’ve had zero introduction to gulp, node.js, etc. Hoping to use these tools soon.