Styling the Document
Because our goal is to reproduce the book’s layout, we can use it as a point of comparison as we work through the project. There are many ways to attack this problem, but we’ll start by addressing the fundamental basis of the book’s design: the two-column layout it uses to put notes and captions into a sidebar.
The Sidebar
In setting up the sidebar, we really only need to ensure that there’s a border separating it from the main content and that the notes and captions actually make it into the sidebar. This turns out to be a lot trickier than one might have hoped.
We could wrap all of the content in a div and then give the sidebar elements a negative right margin to pull the floats into the sidebar. That would let us set ...
Get Eric Meyer on CSS: Mastering the Language of Web Design 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.
