CSS Frames Layout Problem

[raml]

Hello I am relatively new to CSS. I am looking to create a layout that resembles to:

http://extjs.com/deploy/ext-2.0-alph...t/complex.html

and/or

http://www.dhtmlgoodies.com/packages/dhtml-suite-for-applications/demos/demo-pane-splitter.html

However in order to use those I will have to know lots of javascript.

That is why I am trying to use CSS to create a CSS Frame layout for an intranet application. So far the best library I found is Dynamic Drive's CSS Templates.

I found one that I like:

http://www.dynamicdrive.com/style/layouts/item/css-left-top-and-bottom-frames-layout/

However I would like the left frame to be under the header and footer, like in this example:

http://www.cssplay.co.uk/layouts/body4.html

It is just that I dont know how to modify it.

I attached an example of what I am trying to accomplish.

By the way I am using the CSS Frames layouts and not the css liquid layouts because I need the interface to fill the whole browser window.

Any help? or does any one knows where to find a better layout example for an intranet application like the first 2.

Thanks

[Paul O'B]

Hi,

Why do you need such a complicated layout? Can't you use a standard "in the flow" model instead.

These type of frame layouts are always hard to achieve and usually have a number of problems associated with them.

Here is an example I did for a post the other day:

http://www.pmob.co.uk/temp/toggle-2-100-columns3.htm

It was based on this simpler example that I did a while ago:

http://www.pmob.co.uk/temp/2scroll2.htm

However unless you have some special reason for using a frame type layout it would be much better if you used something like this instead.

http://www.pmob.co.uk/temp/2col-nofloatdrop2.htm

[raml]

I will use it for a corporate intranet so I want it to have a desktop like interface, that is why is so important that it fills the browser window. Thanks a lot for the example, although I do have a question about the 3rd one... what makes it so different from the first one.... thanks

[Paul O'B]

Hi,

In the third example the footer will move down when content pushes it down just like any normal page.

The first two are frame type examples and the individual sections will apply scrollbars when the content reaches the bottom thus leaving the footer at the bottom of the viewport and the header at the top of the viewport at all times much the same as a frame layout.