.card { margin: 24px; }The 24px sit outside the box and do not enlarge its background area.
LESSON 41 OF 100
Separate cards with margin
Add transparent space outside a card.
STEP 1 · LEARN
How it works
Margin sits outside the border and separates a box from neighbouring elements. The margin shorthand with one value applies it to all four sides.
.card { margin: -24px; }A negative margin pulls elements together or overlaps them and does not create the requested separation.
STEP 2 · APPLY
Your exercise
Complete the rule for .card with margin: 24px.
index.htmlCSS
Safe resultisolated
The draft stays only in this browser.HTML and CSS allowed · scripts and network blocked
STEP 4 · CHECK
What needs to pass
0%not checked
- ○The margin declaration uses 24px.
- ○The target element is present on the page.
Explain the solution logic
The selector identifies the element, and margin: 24px applies the exact requested behaviour.