[thelist] CSS Two Column Layout with Content above the header

ben morrison morrison.ben at gmail.com
Fri Mar 4 10:51:50 CST 2005


you could try absolute positioning and top margins.

quick example - not tested

<html>
    <head>
        <title>Object reference not set to an instance of an object.</title>
        <style type="text/css">
		#header {
		height:50px;
		position:absolute;
		top:0;
		left:0;
		width:100%;
		background:#ccf;
		}
		#leftCol {
		float:left;
		margin-top:50px;
		width:30%;
		background:#ffc
		}
		#rightCol {
		float:left;
		width:69%;
		margin-top:50px;
		background:#333;
		}
        </style>
    </head>

    <body>
	<div id="leftCol">my left col</div>
	<div id="rightCol">my right col</div>
	<div id="header">my header</div>
    </body>
</html>

ben


More information about the thelist mailing list