JeevesBond — Wed, 18 May 2005 12:27:36 +0000

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.

Dragon of Ice — Tue, 17 May 2005 21:53:33 +0000

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

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

Assassin — Tue, 17 May 2005 02:01:11 +0000

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;
}

chrishirst — Mon, 16 May 2005 22:02:24 +0000

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

timjpriebe — Mon, 16 May 2005 19:11:05 +0000

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

02bunced — Mon, 16 May 2005 18:47:06 +0000

Paul, could you confirm what you want, please?

timjpriebe — Mon, 16 May 2005 17:24:05 +0000

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.

02bunced — Mon, 16 May 2005 16:43:34 +0000

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

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