O'Reilly logo

Responsive Web Design with HTML5 and CSS3 Essentials by Asoj Talesra, Gaurav Gupta, Alex Libby

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

Understanding the different layout types

A problem that has faced web designers for some years is the type of layout their site should use—should it be fluid, fixed width, have the benefits of being elastic, or a hybrid version that draws on the benefits of a mix of these layouts?

The type of layout we choose to use will of course depend on client requirements—making it a fluid layout means we are effectively one step closer to making it responsive; the difference being that the latter uses media queries to allow resizing of content for different devices, not just normal desktops!

To understand the differences, and how responsive layouts compare, let's take a quick look at each in turn:

  • Fixed width layouts: These are constrained to a fixed width; ...

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