Step 6 of 6 · Compound context
Center a reusable card
Center the card inside its stage while keeping the rule local to this component. Preserve a predictable maximum width.
Done looks likeThe stage card centers itself and never grows beyond 280px.
Live CSS workbench
Make the rule predictable.
The preview updates as you type. Submission checks only the exact selector and box-model choices named in this challenge.
Best resultNot submitted1/3 latest checks
Try the challenge now. Sign in to save drafts, attempts, and completion.
Deterministic feedback
Every failed check gives you a next move.
Scope the rule to the staged card
Cap the card width
Center the card in its stage