Centered modals, sticky footers, and media objects are flex patterns. Combine tu-flex + tu-items-center + tu-gap-* before reaching for absolute positioning.
Important interview questions and answers
- Q: flex vs grid with utilities?
A: Flex for one-dimensional distribution; grid when you need rows and columns simultaneously.
Going deeper
In production utility-first CSS work, Common flex patterns matters when documents, stylesheets, or apps must stay maintainable across teams and releases—not only in isolated demos.
Common pitfalls
Watch for copy-paste configs, skipping validation or tests, and mixing concerns (structure vs presentation vs behavior) in one layer.
Practice
- Apply one technique from this lesson in the playground.
- Write one interview-style sentence explaining when you would use common flex patterns on a real project.
Interview prep
- Flex or grid for a card gallery?
Grid when you need aligned rows and columns; flex for one-dimensional toolbars and media rows.