We’re officially moving into the how of our progressive enhancement tower’s second layer: presentation. It astounds me to this day that there was a time when design lived outside of its own bubble, and was a messy, hairy, in-the-way-and-staining-everything part of web markup. You’re going to get a brief history lesson into just how design on the web came to be.
From there, you’re going to learn the programmatically way in which a browser reads CSS, and how you can query properties of the browser to then begin to target your styling in order to respond to different features. At the very end of this chapter, you’ll learn a few ways you can cut corners while prototyping, which takes you a few shuffling steps backward to those dark design ages, but first let’s establish some context.
Exercise One (Easy)
Exercise Two (Intermediate)
Exercise Three (Hard)
Download the sample markup for the Cocktail Guide from the repository and convert it to use a 12-column grid.
Stuck? Maybe it isn’t actually possible...