Flexbox – Fundamentals

Flexbox arranges items along a single axis.

• Container: display:flex; (row) or display:inline-flex;.
• Main axis properties: justify-content, gap, flex-wrap.
• Cross‑axis properties: align-items, align-content.
• Item properties: flex-grow, flex-shrink, flex-basis, order.

---

Example: Centered navigation

.nav {
  display:flex; justify-content:center; gap:2rem; list-style:none;
}