
Responsive Web Design with HTML5 and CSS
By :

At the end of the last chapter, we reminded ourselves that the three core tenets of responsive web design are fluid layout, media queries, and flexible media. We spent Chapter 3 learning all about media queries. Now we know how to wield them to change a layout at a particular breakpoint. In this chapter, we will focus on another pillar of responsive web design: fluid layout.
Eons ago, in the mists of time (well, the late 1990s), websites were typically built with their widths defined as percentages. These percentage-based widths fluidly adjusted to the screen and were known as fluid layouts.
In the years after, in the mid-to-late 2000s, there was an intervening fixation on fixed-width designs—I blame those pesky print designers and their obsession with pixel-perfect precision! Nowadays, as we build responsive web designs, we need to look back to fluid layouts and remember all the benefits they offer.
Until fairly recently, web developers...