Presented by Eric Meyer.
The Web prioritizes ubiquity over consistency.
- Using tables for layout was a hack to work around the limitations of the existing markup of the time.
- CSS 1 was not a layout system. It was meant to be used to change the appearance of content.
- Floats were never intended to be used for layout. Meant to replace the
- Positioning was originally intended to be a layout system, but the implementation was less-than-perfect. Positioned elements couldn't clear other elements. Floats could, which is how we ended up using floats for layout instead of positioning.
It is critical for us to see beyond the assumptions rooted in technical limitations that we've been making for years.
display: flex;should be applied to the containing element. Child elements have a
flexproperty with values such as
last-childand other pseudo-elements care about markup order, not display order.
- Alignment options:
- Flexbox 'justify-content'
- Flexbox 'flex-wrap'
- Defining flexbox containers
- Altering the layout order of flexible boxes
- Flexbox 'align-items'
- Flexbox 'align-self'
- How to determine the direction of flexbox flow