This Looks Familiar

Indeed, it looks like a tweaked out skidoo redux, but in fact it's not at all. The layout is built from scratch to include a few new features. The first being the semi-fluid nature of the layout. Below 1024 pixels the layout will shrink all the way down to 800 pixels at which point it won't shrink any further. Expand it beyond 1024 pixels and you see a dark background with the layout centered on the page. The left and right columns have their space and backgrounds defined with padding and an extra DIV wrapping the layout. This allows the use of borders and background images on the columns. The left-hand column now comes all the way to the top of the page allowing more menu items to appear above the fold as well as creating a new location for a logo graphic. Lastly we have an "access bar" at the top-right of the page. This includes font size changing buttons made from actualy BUTTON elements rather than graphics used in previous layouts. A style switcher element would be a logical next step to include in the bar.

Hiding The Right Column

You'll almost certainly want to know how, so here is the css you need to hide the right column:

.overlap-right, #outer-column-container {
    margin-right: 0;
}
#inner-column-container {
    border-right: none;
    margin-right: 0;
}
#right-content {
    display: none;
}

It's Gray

Quite intentional. It's boring. Dull. So much so you should want to develop your own color scheme for the layout.

Margin Collapse

A common problem with CSS-based layouts is the issue of margin collapse. This problem often appears when a margin value appears to be missing or a gap appears outside an element that contains child elements with margins.

This is a paragraph element with vertical margins. It is contained by a DIV with a green background. That DIV is itself contained by another DIV with a blue background.

You would think the margins on the paragraph would be contained within the green DIV and none of the blue background would be showing. However this isn't the case. The margins of the paragraph element are collapsing. To fix this you can add a border or padding to the green DIV which will stop the margins from collapsing outside of the green DIV.

The green DIV now has 1 pixel of padding applied to it. This prevents the margins from collapsing outside of it.

For more detailed information about this problem/feature of CSS check out this write-up by Andy Budd.