CSS Box Properties: Think INSIDE the Box

"Think Outside the Box" - this has become such a cliche in business, but in CSS you want to stay inside of it.

All elements in HTML generate a rectangular box.

This is called the element box.

This box describes the amount of space the element and its properties occupy within the layout of the document.

Each element or box will influence every other box in the document.

For example, if the first element is two inches tall, the element to follow it will be two inches from the top of the document.

If the first element shrinks to one inch, the following element will then be one inch from the top of the document.