CSS Site - 2 Column + Header

You need to create an all-embodying div, and then do sub divs

ie

The css would look like so

container { width: yourchoice }

header {width: yourchoice; height: 80px }

left { width: 240px; float: left; }

main { margin-left: 250px; }

For more info, look at dodifferent.org.uk, and see what you can learn from the code there

I may be misunderstanding Paul, but I believe what he wanted was a main div that resizes with the window. He wants one column to be a specific pixel size and the other to dynamically resize with the window. Yours does not resize with the window.

I'd be interested in knowing how to do this also. As a relatively newbie to CSS, I've not yet figured this one out.

Paul, could you confirm what you want, please?

Upon rereading, I think he's pretty clear.

Quote: The right-hand side should be about 300px wide, and this should be fixed to the right, which when we resize the window, the left-hand resizes and refits the text appropriately

having a fixed size div and a fluid div side by side is usually problematic. The Safest way is to use percentage for both and float the smaller container to the right.

like so Two column floated right

Ok, here's how I do it. It's not completely safe and you have to be careful with it but here's how it works at http://assassin.cjb.cc

NOTE: I use absolute position and this can be very picky when it comes to inter-resolution display! I'm only posting it because the right side of the content floats as was per request. Also, it may be wise to throw a container div around the entire thing as containers are never bad ideas.

header code here

links here

the css has to be precisely aligned now. This means absolute positioning

.header {
height: 150px;
width: 800px;
}
.links {
position: absolute;
top: 150px;
width: 150px;
}
.content{
position: absolute;
top: 150px;
right: 150px;
}

just check out the source of http://www.orangedropcreative.com/lib/

I beleive it's what you want, only everything is left aligned instead.

Quick conceptual CSS point about this: Why use classes to distinguish the div elements? Surely these should be id's as you aren't going to have more than one header (etc.) I can't imagine anything will go wrong because of this but it's good practice and will make your code more readable when you start defining CSS for different types of content.