Everything about boxes in CSS

One thing you'll notice about writing CSS, most of it is about boxes. It includes setting size, color, and position. Most HTML elements on your page can be thought of as boxes sitting on top of other boxes

CSS layout is mostly based on the box model. Each box taking up space on your page has properties like:

• Padding, the space around the content. In the example below, it is the space around the paragraph text.
• Border, the solid line that is just outside the padding.
• Margin, the space around the outside of the border.

Here we also use:

• width (of an element).
• background-color, the color behind an element's content and padding.
• color, the color of an element's content.
• text-shadow sets a drop shadow on the text inside an element.
• display sets the display mode of an element. 

Example code for styling the body with everything applied:

body {
  width: 400px;
  margin: 0 auto;
  background-color: #FF9500;
  padding: 0 40px 40px 40px;
  border: 5px solid black;
}