| 35 | Producing More Two-Column Layouts |
As we saw in Task 33, Jazzing Up Layouts with Columns, we can use Compass to generate columns in our HTML. However, with Blueprint, there’s an even easier way. Blueprint controls more of the column layout than Compass, but it still lets you have a say over the widths.
First we need to define the number of columns and the width of each column. Here we’re using six columns of 65px width. Once we’ve done that, we can @import "blueprint".
As we start adding to the .two-col class, we must first include the container. We can also set the background and set other box-wide things here. Then it’s on to the columns.
With our header, we want it to span the whole width of the item, and the same goes for the footer. ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access