CSS Reference is a free visual guide to CSS. It features the most popular properties, and explains them with illustrated and animated examples.
FLEX: A simple visual cheatsheet for flexbox
Enables flex for all children. Establishes the main axis. Wraps items if they can't all be made to fit on one line. Attempts to distribute extra space on the main axis. Determines how items are laid out on the cross axis. Only has an effect with more than one line of content.
GRID: A simple visual cheatsheet for CSS Grid Layout
Learn all about the properties available in CSS Grid Layout through simple visual examples.