Как на CSS сделать 2 столбца дивами?

[FireDex]

Вопрос в следующем: надо сделать 2 слолбца из дивов, высота которых может меняться в зависимости от содержимого. Исходный код такой:

#main {
	clear: both;
	width: 950px;
	padding: 5px;
	margin-left: auto;
	margin-right: auto;
}
#maincontent {
	border: 1px solid black;
	width: 700px;
}
#sidebar {
	border: 1px solid black;
	width: 200px;
}
<div id="main">
<div id="maincontent"></div>
<div id="sidebar"></div>
</div>

Если использовать float: left; для #maincontent, то sidebar отображается под maincontent. Если использовать float: right; для #sidebar, то sidebar отображается справа, как и надо, но под maincontent. Если же обоим сделать float, то всё отображается правильно, но оба div'а вылазят за пределы main.
Кто что подскажет?

[Wicort]

Укажите float: left; у обоих блоков.