8. Fluid and Elastic Layouts

Experiment with page layouts that expand and contract

It’s only natural to talk about how an entire page can embrace flexibility as well as the components contained within it. We’ve gone over several components in previous chapters of the book, but now let’s explore page layouts in general—how CSS can be utilized to create columned pages that expand and contract regardless of screen, window, or text size.

Before we begin, I should mention that I’m not going to fuel the debate over whether a fluid or elastic layout is better than a fixed-width layout (or vice versa). I believe that each has its own place, and deciding to use a fluid, elastic, or fixed-width layout hinges on many variables—factors that are unique to ...

Get Bulletproof Web Design: Improving flexibility and protecting against worst-case scenarios with XHTML and CSS, Second Edition 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.