Sidebar

#sidebar {
  float:left;
  width:340px;
}

		

The key to this layout is setting the background image on the #container div. The background image matches the colors we want on each column.

Main content

#content {
  float:left;
  width:620px;
}		

#container {
  width:960px;
  margin:0 auto;
  background: url("faux-columns.png") repeat-y;
  overflow: hidden
}
		

The container will always be the same height as the longer column.

Regardless of which column is shorter the background image will make it appear as though it's the same height as the longer column.