[thelist] 2 col layout, need a little help

[ben morrison]

> any ideas? i know min-height is the easy answer approach but wondering
> if there is maybe a better way to layout the page? i particulary like
> the use of negative margins so the main content comes first then the
> menus in the code.

You can still order your source content first using combinations of
floats without neg margins.

#container {width:700px;}
#rightCol {float:right;width:500px;}
#leftCol {float:left;width:180px;}

<div id="container">
	<div id="rightCol">
		<h1>your heading</h1>
		<p>Content paragraph</p>
	</div>
	<div id="leftCol">
		<ul>
			<li><a href="#">Nav 1</a></li>
			<li><a href="#">Nav 2</a></li>
		</ul>
	</div><div class="clear"><!-- --></div>
</div>

If its suppsed to sit underneath the nav and the content you should
clear the floats.

.clear {clear:both;overflow:hidden;height:1px;}

You could use a min-height for supported browsers:

#rightCol {min-height:20em;}

and because IE treats height incorrectly it will kind of do a
min-height, so using a IE hack.

* html #rightCol {height:20em;}

Use em's or a relatize size so increasing font sizes doesn't ruin your layout.

ben