Fixed header and sidebar:

Experimental Layout - Use at your own risk

Tested in IE5, IE5.5, IE6, NN6.2, Mozilla 1.3, Firefox 1.0 and Opera.7.5. (all PC xp home)

Seems to also work in ie5.1mac and Netscape 7.2 mac

The thing to watch out for in IE is that as the left column is fixed any content which is below the fold will be unaccessible because a scrollbar will not appear.

Also not that this layout is best for text as you will not get a horizontal scrollbar if the content is a fixed width. See the alternative layout here.

These are the styles for ie pc only and are hidden using the mac hiding hack coupled with * html.

/* mac hide \*/
* html, * html body{
overflow:hidden;
height:100%;
}
* html #left {position:absolute;}
* html #headerinner{margin-right:-133px;voice-family: "\"}\""; voice-family:inherit; }
* html #headerinner{margin-right:-17px;}
* html #header{position:absolute;}
* html #outer {height:100%;overflow:auto}
/* end hide*/

The only bit in the ie styles that will need altering if you change sizes of the fixed elements is in this section below. This gives ie5 a different size only by using the voice family hack to jump the next style

* html #headerinner{margin-right:-143px;voice-family: "\"}\""; voice-family:inherit; } /* ie5 gets this*/
* html #headerinner{margin-right:-17px;}/* ie5.5 and ie6 get this*/

This gives ie5 a different size only by using the voice familyhack to jump the next style. This just makes the header stretch in ie5 all the way across the screen (ie 5.5. and ie6 are ok anyway). It will need to be changed according to the width of the left sidebar. The margin-right:17px is for ie5.5, and ie6 is to avoid covering the right scrollbar.

Some content to scroll

Some content to scroll last