Summary 4

Understanding the Box Model

The box model includes the properties of three groups: border, padding and margin. When trying to understand how these properties work an easy way to remember them is that padding pushes inward of the boarder, and margins push outward. The property of the boarder is made up of: width, style and color. The point behind padding is that it adds space between the box and the content within.

Floating and Clearing

Floating is where an element is moving out of the normal flow that the context may have it in. The intention behind this action is to allow for text to flow around images that may be placed. Like a wrap feature. The clearning property allows you to stop the elemetns from floating around.

Display Property

Every element will have both a position property and a display property. Most elements however will have a display default property. This is where block or inline are used. Block elements (paragraphs) are stacked one on top of the other. Inline elements (columns) sit side by side.