Chapter 4 Complex Layouts

In this chapter, we’ll dig into a few CSS layout topics. In the first half, we’ll tackle two fundamentals of CSS layout: the box model and stacking context. Understanding these concepts will help you create complex layouts and diagnose layout bugs.

In the second half of the chapter, we’ll look at two newer layout-related CSS specifications: the CSS multicolumn layout module and the flexible box module (better known as flexbox). Both modules allow developers to create layouts that are robust and adaptable across a range of device sizes.

Managing the CSS Box Model

Perhaps the most important point to understand about CSS is this: Everything is a box. More specifically, every element in a document generates ...

Get CSS Master 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.