<style>
div#nav {position:absolute; width:150px;top:10px;left:0px;background-color:red}
div#content{position:absolute;top:10px;left:0px;margin-left:150px;margin-right:120px;background-color:blue;}
div#rightcolumn{position:absolute;top:10px;right:0px;width:120px;background-color:yellow;}
</style>
<body>
<div id="header"><h1>Three column layout with header</h1></div>
<div id="nav">
<ul>
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a></li>
<li><a href="#">Link 3</a></li>
</ul>
</div>
<div id="content">
<h1>A Simple Three Column Layout</h1>
<p><strong>Step x - bold text here...</strong> In this example, we are going to use
absolute positioning to create a three column layout, which is also a very common page
layout you will see on the web. This format enables you to follow the widely-adopted
convention of placing navigation in a vertical "stack" on the left side, and use the right
side for things like testimonials, promotions, ads or other links.</p>
<p>In this design, we'll fix the width of the side columns and let the content column
fill the rest of the browser's width.</p>
</div>
<div id="rightcolumn">
<p>This is temporary filler for the right column. We'll put something more interesting
in here later.</p>
</div>
</body>