Posts

CSS Flex — Interactive Tutorial

I’ve gone over pretty much every single existing flex tutorial from froggy to the official W3C documentation. But there is one thing you will  never  learn about flex without an interactive example:  Behavior of properties when the size of an * individual  item changes.   You can see what I mean below: I created this  new flex tool  overnight and  gradually improved  it over the course of the next few days. The rest of this tutorial will provide a few insights of what I discovered while playing around with it! What I Learned About Flex While Designing The Flex Generator There are a few interesting quirks about flex that may not always be obvious at first. For example,  narrow items  don’t stretch and behave like  flex-start even if  stretch  is applied. Below I will walk you through the rest of them.
Recent posts