- Block-level elements (h1, p etc) and inline elements (em, strong etc)
have an area: the core
Content Area
- This is surrounded by optional:
-
Padding, has the same colour as the background to the element
-
Border with a colour and style
-
Margin which is transparent
-
Background for the area inside the border
- Content, padding, border and margin together define a box
- Margins, borders and padding sizes and properties can be set
- These can be different for top, right, bottom, and left in that order
-
bottom margin and next top margin will collapse to one
- Usual to define space between elements above or below but not both
- the box hierarchy can be to any depth
-
strong element inside
-
em element inside
-
p element inside
-
body element