CSS Height Issue

HTML & CSS
1

For some reason unless I put a min height inside my css the middle content overlaps the background as shown here

Any idea what could be causing this?

Thanks

Martin

2

Containers don’t wrap around floated contents by default. There are a few ways to force this enclosing, the easiest being overflow: hidden on the container:

#oCenterColExtend {
  float: left;
  margin-right: 10px;
  margin-top: 40px;
  width: 645px;
  [COLOR="Blue"]overflow: hidden;[/COLOR]
}

EDIT: O, remove the height from here too:

#oContent {
  float: left;
  [COLOR="Red"]height: 300px;[/COLOR]
  margin: 39px 0 0 7px;
  width: 100%;
}