[sleepingfish]

AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAARGH

AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA ARGH

I've tried convincing everyone at work to go XHTML with CSS but godamnit, I give up, how can I convince them if I can't make some DIV's do what a table can. It should be simple. IT SHOULD BE SO SIMPLE.

Split the page into 2 parts, a top menu DIV 100 pixels high, and a main content DIV below that streches to fill the page to the bottom, but put the height to 100%, positioned 100px from the top and it will overlap the bottom of the page because it's 100px from the top.

demo url coming soon, help.

[smallbeer]

make the bottom div *look* like it's stretching to the bottom by using a sneaky background image the same colour as the div?

[Stickman]

Put the 100px div inside the 100% height div.

[Stickman]

Or... do what he said.

[sleepingfish]

Cheers people, not sure that would fix it, head is a bit of a mess at the moment though, so I'll keep on thinkning.

Here's a beautiful example of what i want to do with CSS, done with tables.

tables

[Stickman]

Originally Posted by sleepingfish

Cheers people, not sure that would fix it

The cheek of it.

Both our suggestions will do what you want.

[sleepingfish]

Originally Posted by Stickman

The cheek of it.

Both our suggestions will do what you want.

Sorry, not enough caffeine perhaps, but if I start putting content in the botom section with height set to 100%, it will go over (or under) the top 100px menu won't it.

Yours trying not to be too cheeky,

James

[Stickman]

One way to do it:

- Make a #frame div with 100% height.
- Float a #top div with 100px height and same width as #frame.
- Float a #content div (which will be forced below it).

[sleepingfish]

ok, but then if I want #content to stretch full height and width, won't it go beyond the browser window because it's been forced 100px down the page already?

[Stickman]

Probably.

...but then you can make the layout the background image of #frame (like smallbeer said) and #content transparent - so it looks like it stretches down even if it doesn't.

[sleepingfish]

That's what I'm afraid of having to resort to, but then if #content has too much text or images it will all get buggered. Why does the stupid client want it all to stretch 100% anyway?

[Stickman]

Why will it all get buggered?

Transparent divs are usually the easiest way to do fiddly layouts. The lines, borders etc can be in a background gif and you just lay the content over the top.

[Brown]

oooh poor fish, poor fish.

stick with it! (no pun intended stick boy)

[oli]

Originally Posted by Stickman

Why will it all get buggered?

Transparent divs are usually the easiest way to do fiddly layouts. The lines, borders etc can be in a background gif and you just lay the content over the top.

I like that, never thought of it before

[Luke Redpath]

Originally Posted by sleepingfish

That's what I'm afraid of having to resort to, but then if #content has too much text or images it will all get buggered. Why does the stupid client want it all to stretch 100% anyway?

Background image method really is the easiest. Make the page background the same as what you want the bottom (content) part to be, then tile horizontally a 100px high, 1px wide image the color of what you want the top div to be.