Basic CSS layout issue with 960 grid system

Question

Upon inspection of the element <div id="wrapper"> in firebug it seems that it does not contain all the content that is nested inside it and is in fact very small.

Another issue is that <div id="footer"> is positioned at the top of the page when inspected in firebug and I am unsure as to why.

Any help would be much appreciated. There is a link below.

http://www.the-session.co.uk/pros/

Answer 1

Define your body min-width:980px; and clear your .container_12 overflow:hidden;

as like this

    body{
    min-width:980px;
    }
.container_12{
    overflow:hidden;
    }

Answer 2

Try clearing the floats in the wrapper:

#wrapper {
    overflow: hidden;
}