When would you use CSS Grid instead of Flexbox?
PICTURE THIS: FLEX VS GRID
Simple meaning
Grid is for two-dimensional layouts where rows and columns must line up, like a dashboard or photo gallery.
WHY — CSS instead of guessing?
Why interviewers care about CSS:
on CSS.
the situation, the default choice, and one exception - that reads as experience.
Name the idea, why it exists, then one short example.
End with when you use it and one common pitfall.
STEPS — What happens step by step?
Before you speak the answer, walk the interviewer through these steps:
- 1Grid is for two-dimensional
layouts where rows and columns must line up, like a dashboard or photo gallery.
- 2Flex is simpler when
I only care about one axis.
- 3In campus rounds I
say many pages use both: grid for the page shell and flex inside each cell.
- 4Give an example
One tiny concrete case you can say aloud.
- 5Common mistake
What juniors usually get wrong.
- 6Close
When you pick this over the alternative.
EXAMPLE — See it in action
Here's a short line you can speak, broken into clear beats:
Note: Adapt this scaffold to your own project — keep it under 60–90 seconds.
Key takeaway
Grid is for two-dimensional layouts where rows and columns must line up, like a dashboard or photo gallery. Flex is simpler when I only care about one axis.