CSS Boxes

Block tags like div ,p, and h1 live in a "box". Working from the inside out, you have.

1. The text or image content wrapped as appropriate taking up horizontal and vertical space.
2. The padding is the space between the content and the border and is colored the same as the text.
3. The border has its own color and width.
4. The margin is the space between the border and the rest of the elements in the document.
5. Also note that while the ul and li items are children of the p tag, they have their own background-color.

6. But you can have a paragraph inside of a list.

7. And a list item can have its own background color.