In this chapter, we'll talk some more about design and layout.

The so-called box model defines that there's a box around every HTML element and describes the amount of space the element takes up.

<html>
<head><style>p {background-color: #44b3c2;width: 150px;padding: 25px;border: 25px solid #f1a94e;margin: 25px;}
</style>
</head>
<body><p>I'm the actual content.</p></body>
</html>
]]>

Sweet! HTML elements consist of borders, padding, margins and, well, the actual content. But what exactly are these things?

That doesn't look right, does it?