Category Understanding Flexbox

CSS Flexbox Cheat Sheet

Flexbox allows you to create fluid layouts easily. If you find yourself constantly looking up the syntax or how it work, this handy cheatsheet is all you need. Container display: flex or display: inline-flex: creates a flex context (or an…

Switching Flex Direction

What happens when you switch flex-direction? When starting off with learning the flexbox model, this part was the most confusing. I bet a lot of newcomers to the flex world find it that way too. You remember when I talked…

Auto-margin Alignment

Beware of margin : auto alignment on flex items. When you use margin: auto on flex-items, things can look quite weird. You do need to understand what’s going on. It may result in unexpected results, but I’m going to explain…