﻿
/* layout.css - a css window layout (approach 1)
 *
 * Stack levels: 5-10
 * Version: 0.1
 * Manual at: http://www.lwis.net/journal/2008/05/13/pure-css-window-layout/
 *
 * (cc) 2007-2008 Tom@Lwis (www.lwis.net). Some Rights Reserved.                         
 * This style sheet is licensed under a Creative Commons License
 * http://www.creativecommons.org/licenses/by-nc-sa/3.0/
 */

html, body { overflow: hidden; height: 100%; }
body { padding: 100px 0 50px; }
#container { height: 100%; }
#content { position: relative; height: 100%; z-index: 5; }
#sidebar { position: absolute; top: 0; left: 0; z-index: 8; height: 100%; width: 200px; overflow: auto; }
#mainbar-wrapper { height: 100%; padding: 0 0 100px 200px; }
#mainbar { overflow: auto; height: 100%; }
#adspace { height: 100px; width: 100%; position: absolute; bottom: -1px; right: -1px; z-index: 7; padding-left: 200px; }
#header { overflow: hidden; position: absolute; top: 0; left: 0; z-index: 10; width: 100%; height: 100px; }
#footer { overflow: hidden; position: absolute; bottom: 0; left:0; z-index: 9; width: 100%; height: 50px; }

i{content:"\"/*"}

html > body { padding: 0; }
#container > #content { position: absolute; top: 100px; right: 0; bottom: 50px; left: 0; height: auto; }
#content > #mainbar-wrapper { position: absolute; top: 0; bottom: 100px; left: 200px; right: 0; height: auto; padding: 0; }
#mainbar-wrapper > #mainbar { position: absolute; z-index: 6; width: 100%; }
#content > #adspace { right: 0; padding-left: 0; left: 200px; }