Does the background of an element includes its margin?
No. The background of an element includes its content area, its paddings, its borders, but not its margin.
How to deal with the disappearing background problem?
If a parent element has background color or background image via CSS, and all of its non-empty children are either floated or position:absolute, we can no longer see the background color / image of the parent element. This happens because children that are floated or position:absolute are removed from the normal flow, therefore the parent element collapse. To fix this problem, we can:
- explicitly set overflow:auto for parent element.
- if possible, do not set the background on the parent element, but set the background of the element higher up