Last update at 13 · 05 · by milo

‧‧‧ One of 736

Fluid / liquid or responsive layout? There should be no question about this, as nowadays the screen resolutions vary from 800 (yes, still in use) to 2400 pixels width, imagine how bad a responsive 900 px layout looks in a 28 inch browser window? A liquid (or elastic as Roger Johansson mentioned ) layout will always adjust itself on the browser window, only IE 6 makes problems as always: IE Doubled Float-Margin Bug.

Glish describes a four layout column technique that can actually be used to provide as many columns on a page as you like.

Fluid layout

Max design explains one method of achieving a successful liquid layout the easy way.

Creating Liquid Layouts with Negative Margins by A list apart is providing some useful tips on creating a fluid layout with negative margins, which allow pushing the content area away from the sides of the browser and leaving room for the sidebar.

Liquid Designs ( created by Christian Montoya ) has a nice showcase of the best fluid designs including mine : 1200, 1024 and 800pixels browser size. Screenshots are taken with Firefox, but IE (all orphans) shows it the same way.

Four layout column technique

Designing often necessitates considering the aesthetic, functional, economic and sociopolitical dimensions of both the design object and design process. It may involve considerable research, thought, modeling, interactive adjustment, and re-design.


Home DesignFluid layout

Say hello