Как растягивать родительский блок без float:left

[jumancy]

помогите решить одну проблемку:

есть общий блок container, внутри него блок main со свойствам float:left и футер, который прижат низ экрана. Общий блок имеет опред. ширину и центрировано. проблема в том что когда контент блока main больше он выходит за рамки container и его бордер не охватывает всю высоту. Как можно от этого избежать? В принципе можно, если придать container свойство float:left, но он должен быть в центре. Для наглядности даю код

HTML

<div id="container">
<div id="main">
контент
</div>
</div>
<div id="footer">
</div>

CSS

* {
	margin: 0px;
	padding: 0px;
}

html, body {
	margin:0;
	padding:0;
	width:100%;
	height:100%;
}
.cont {

}
#container{
   	margin:0 auto;
	position:relative;
	background:#fff;
	min-height:100%;
	width:967px;
	height:auto !important;
	height:100%;
	min-height:100%;
        border: 1px solid #000;
}

#footer {
	margin-right:auto;
	margin-left:auto;
	position:relative; 
	height:40px;
	margin-top: -40px;
	width: 967px;
}
.main {
    float:left;
}

Edited June 22, 2011 by jumancy

[jumancy]

Надо вставить блок со свойствам clear:both , как то сразу в голову не пришло))))

[Searcher]

Во-первых, вы перепутали container и content

Во-вторых, не надо никаких лишних блоков! Просто задайте родителю плавающего блока overflow:hidden

[jumancy]

da, na samom dele, spasibo

[jumancy]

Searcher

Просто задайте родителю плавающего блока overflow:hidden

Футер изчезает тогда

[Searcher]

Это вы где-то намудрили с прижатием футера... Вот отличный вариант нашего любимого мастера.