Advanced Flexbox – Wrapping & Alignment

Advanced concepts:

• flex-wrap:wrap + align-content for multi‑line alignment.
• order to rearrange items without changing HTML.
• flex-basis with min-width for fluid cards.

---

Example: Responsive card deck with equal height

.deck {
  display:flex; flex-wrap:wrap; gap:1rem; align-content:stretch;
}
.card { flex:1 1 calc(33.333% - 1rem); }