Flexbox
summary
Shows concrete patterns and results: use flexbox as progressive enhancement layered on floats/table-cell, use Modernizr or Sass mixins and Autoprefixer to manage vendor syntax, and prefer the current syntax because the 2009 variant renders slowly. Demonstrates navbar tricks (justify-content: space-between and margin-left:auto hack explained to center a logo), equal-height media objects via align-items: stretch, responsive forms sized with flex: 1 1 auto to avoid cutoff and equalize heights, and cites 93% support while noting IE9-and-earlier caveats.
AI-written summary · about
chapters (8)
- 0:00Start
- 1:46Problems with CSS 2 layout
- 8:44Combine with inline-block
- 18:51Enhance form with flexbox
- 20:28Defining the flex property
- 21:40Breaking down the flex property
- 27:55Enhance header with flexbox
- 39:25The Guardian: opposite approach
