Chapter 8: CSS Box Model
A Complete Frontend Developer Textbook for Beginners (2023 Edition)
Published in
10 min readJan 4, 2022
This is the textbook version of Lesson 8 of 100 from the Udemy video course: A Complete Frontend Developer Course for Beginners
← Chapter 7: CSS Units of Length
Overview
This lesson covers the following HTML tags, CSS properties, and JavaScript commands for the first time:
HTML
None.
CSS
JS
None.
This lesson begins with this Codepen. Code along with me to increase retention!
Lecture
In the last lesson, we learned how to add dimensions to any sectioning tags.
<html>
<head></head>
<body>
<header></header>
<main></main>
<footer></footer>
</body>
</html>
In fact, we can add a width and a height to any HTML elements.
The reason this is possible is because per CSS, everything has a box around it.