O'Reilly logo

Flexible Web Design: Creating Liquid and Elastic Layouts with CSS by Zoe Mickley Gillenwater

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Chapter 1. Understanding Flexible Layouts

The term “flexible layouts” can mean different things to different people, so let’s make sure we’re all on the same page before we dive into designing and building them. In this chapter, you’ll learn the defining characteristics of each of the main layout types—fixed-width, liquid, elastic, and hybrid—described in the Introduction. We’ll focus on the benefits and pitfalls of each so that you can decide which type might be right for your particular site.

Types of Layouts

We can group web-page layouts into three categories based on how their width is set: fixed-width, liquid (or fluid), and elastic. It’s also possible to combine these layouts into hybrid layouts by mixing units of measurements; each column ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required