Flexbox
summary
Concrete rules and demos show how flexbox distributes space: flex: 1 0 auto makes items start at auto size then share leftover space, flex-grow and flex-shrink split available room proportionally, and margin-left:auto pushes groups apart. Examples demonstrate wrapping, order:-1 to reorder visually (with current accessibility caveats), toolbar/form patterns that simplify layouts, and live demos that mostly work but occasionally break; browser prefixes and two syntaxes still require care.
AI-written summary · about
chapters (29)
- 0:00Introduction
- 1:21Space Buzz
- 2:06CSS Level 1
- 2:21Layout
- 3:18Tab Atkins
- 4:40General Page Layout
- 7:13Bob
- 10:27Properties
- 11:09Flex Direction
- 12:26Flex
- 15:01Flex Grow
- 16:13Flex No Grow
- 16:37Flex according to n
- 20:25Margin Auto
- 21:21Alignment
- 22:36Space Between
- 24:14Align
- 25:20Order
- 26:17Group
- 28:12Centering
- 29:19Unknown Menu Items
- 31:06Source Order
- 33:34Tab Groups
- 35:08Form
- 37:22Product Listings
- 39:49Lacking Elements
- 41:51Recreate Tables
- 47:13Consistency
- 49:09Browser Compatibility
