CSS मधील प्रत्येक घटक हा आयताकृती बॉक्स आहे जो अंदरून बाहेरच्या दिशेने चार स्तरांनी बनलेला आहे: content, padding, border आणि margin. ते कसे एकत्र होतात हे समजणे हा सर्व लेआउटचा आधार आहे.
text
┌─────────────── margin ───────────────┐ ← space OUTSIDE, between elements
│ ┌──────────── border ────────────┐ │
│ │ ┌───────── padding ────────┐ │ │ ← space INSIDE, around content
│ │ │ content │ │ │ ← text/image (width × height)
│ │ └──────────────────────────┘ │ │
│ └─────────────────────────────────┘ │
└────────────────────────────────────────┘