# Inheritance

HTML and CSS define inheritance as direct "parent to child" relationships.

No skipping generations; it is strictly a top-down relationship. Child elements cannot inherit directly from their grandparents or other ancestors. Parent elements cannot inherit from their children or other descendants.

Test resize your browser.
(A)

- No width explicitly applied, inherited 100% of `<body>`

(B)

- `set width:50%` = 50% of parent `(A)`

(C)

- `set width:50%` = 50% of parent `(B)`
- `set color:red`

(D)

- `set width:auto` = 100% of parent `(C)` (not including padding and margin)
- inherited `color` from `(C)`