The Box Model

All HTML elements displayed in the browser are drawn in a “box” shape. While the shape isn’t always a perfect square, it does have four sides—top, right, bottom, and left—and a central content area surrounded by an area of padding, then a border, then an outer margin area. CSS can target these sides to manipulate elements in various ways; for example, by adding padding, margins, and borders to the different sides, or by adding images and color inside the content, padding, and border areas.

Design is creativity with strategy ~ Rob Curedale


Chapter 08 Exercise Files

Additional Learning Resources

Do you have resources you’ve found and would like to share? Please contact me!