Display Properties in Oxygen EXPLAINED (Block, Inline-Block, Flex, Inline-Flex, Inline, Grid, etc.)

Mar 8th, 20222 min

Kevin Geary

I've gotten a lot of emails and have seen a lot of questions in the Oxygen community about display properties (flex, inline-flex, block, inline, inline-block, grid, etc).

Half the questions are from beginners who don't have a lot of experience with these display properties and half are from experienced people who are confused as to why these properties don't work in Oxygen the way they work "in the real world."

It's true … Oxygen does some things by default which break a few of the traditional display properties. If you don't know this is happening, it can be super confusing and frustrating.

By the end of this tutorial you'll know exactly what these display properties do and how they're supposed to behave vs how they actually behave in Oxygen. In short, you'll be able to use every single display property with confidence.

Want more detailed trainings? Join the Inner Circle: https://digitalambition.co/inner-circle/

Want my responsive CSS framework? https://automaticcss.com

01:25 Display Block (Default vs Oxygen)
09:45 Display Inline (Default vs Oxygen)
15:40 Display Inline-Block
16:59 Display None vs Visibility Hidden
18:57 Display Flex
32:11 Display Inline-Flex
36:00 Display Grid