The Box Model

Content...

Colors:

margin border padding content

Grid

The grid is displayed purely for visual reasons.

Light lines are every 10px, dark - 50px

Dev Tools

  • Right click inside the blue "Content" box and select "Inspect Element".
  • Play with CSS for the #demo in "Styles" tab on the right side.
  • Look at the "Computed" tab on the right side.