CoreBeginner40 min read
2. Flexbox
CSS Layout · 12 pages source format
One-dimensional layouts: rows and columns that distribute space.
What you'll learn
- justify/align
- gap
- flex
Key idea
flex container controls direction and distribution; items can grow/shrink.
Quick check
Main axis is controlled by…
Do this now
Write 3 notes on: Flexbox.
Clear?
Practice
Rebuild a nav and a card row with flex only.
.row { display: flex; gap: 1rem; justify-content: space-between; }Do this now
Commit one file practicing Flexbox.
Clear?