the basic layout… #1

…on www.gunlaug.no/

main containers exposed…

Third wrapper (#superwrapper1 - yellow border) creates space for the fixed-width side-column alongside the fluid main-column.

Fifth wrapper (#superwrapper3 - dashed aqua border) is pulled out over the edge of third and forth container, and contains all inner containers.

inner containers…

The side-column overlaps the flexible and auto-adjusting containers (red & blue borders) that holds the main content sections. These main sections (green borders) are kept in place by their left and right margins.

this is a demo…

I have written an article about this layout.

sincerely georg; sign

Hageland 13.nov.2007
last rev: 13.nov.2007

the basic layout…

NOTE: there are a few pixel dimensional error here and there in the layout itself, because I have not compensated for the width of the many borders added for visualization.
•
However, as you can see: the basic construction can take that, and a whole lot more, without falling apart. I have overcompensated for Internet Explorer's many dimensional bugs, and this makes the layout robust™ in all browsers.
— Georg

site layout…
…2004 - 2007