From the course: Making Sense of the CSS Box Model

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

What is the CSS Box Model?

What is the CSS Box Model? - CSS Tutorial

From the course: Making Sense of the CSS Box Model

Start my 1-month free trial

What is the CSS Box Model?

- [Instructor] With the typographical terminology and principles in place, it's time to take a look at what's known as the CSS Box Moxel, the main subject of this course. As I explained earlier, when we add content to a document wrapped inside tags, the browser draws a box around that content. Each tag or element is represented as a rectangular box. We can then change the contents and appearance of the content of the box as well as the different properties of the box itself using CSS or rather we can provide the browser with instructions on how to render the box once it's encountered. The CSS Box Model is the premise on which these instructions are based. In short, using the CSS Box Model, we can tell the browser exactly how we want a particular box and its contents to be displayed. To see how this works, we'll look at one paragraph of type in isolation. In CSS, each of the rectangular boxes that wrap the contents of an…

Contents