CSS: DIV Positioning.

Well, I gave pure CSS a crack on my current site. I'm stuck though.

I have a container div, and then 2 columns inside the container, one set to float left and the other float right. Somehow when the columns expand vertically, they don't push the container div's bottom border down, but rather just over ride it.


div#outer{
width:780px;
border:5px solid #633e17;
}
div#left{
float:left;
width:443px;
border:1px solid #80ae35;
}
div#right{
float:right;
width:336px;
border:1px solid #80ae35;
}


How do i Fix this?

Read this http://www.positioniseverything.net/easyclearing.html

I can guarantee that if you viewed the page it would look like its working properly but its not.

well I don't really want to do it the wrong way. I'm fairly new to divs. Is there a proper way of clearing it?