Chapter 5: Layouts

CSS layouts have come a long way in recent years. Not so long ago, we were wrestling with div soup in our HTML documents and using heavy CSS frameworks that relied on floats and clearing to get our layouts working just right. Or we threw a bunch of JavaScript at them. These days, it’s much easier to create the kinds of complex layouts that used to require nested elements or expensive DOM operations.

In this chapter, we’ll look at several aspects of CSS layout. In the first half, we’ll review some of the basics: normal flow, floated elements, and how to clear them. We’ll follow that up with refreshers on both the box model and stacking context. Understanding these concepts will help you diagnose and fix layout bugs.

In the ...

Get CSS Master, 2nd Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.