Creating a multicolumn layout

Floats were designed to flow text around an image. However, floats are also the most common way of building a multicolumn layout. In this section, we'll look at how to float elements next to each other in order to create a page layout.

So, what we currently have in the HTML in the secondary section are three div tags with a class of column:

The following screenshot illustrates the final site. This is what we're aiming for. We want three equal columns with a small gutter or margin in between:

In our current site, ...

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