Centre the Card
10 minBeginnerCSS
Centring something on both axes is the most famous small problem in CSS. Your menu card is stuck in the top-left corner of the page. Move it to the exact centre of .stage.
- Before: the card hugs the top-left corner.
- After: the card's centre point is the same as the stage's centre point (within 2px).
Constraints
- Change only
style.css. Keep the.stageand.cardclass names. - Keep the card about 260px wide — don't stretch it to fill the stage.
- Any real technique is fine: flexbox, grid, or positioning. The checker measures where the card actually ends up, not which properties you used.
Edit style.css so .card sits exactly in the middle of .stage — horizontally and vertically — without stretching it.
Checks
- The card is centred horizontally
- The card is centred vertically
- The card keeps its size
Preview
Console output from your code appears here.