How to center using margin: auto while keeping non-centered divs from moving off page on browser resize
#TopWrapper
{
    padding: 0px 200px;
}


#TopMiddleWrapper
{
    width: 826px;
    margin: 0px auto;
}

#TopWrapper {
    width: 100%;
    padding: 0px 200px;
    float: left;
    min-height: 450px;
    height: auto !important;
    height: 450px;
    background: #7698b8 url(../Images/body.gif) repeat-x 0 0;
}

#PhotoWrapper {
    width: 916px;
    margin: 0 auto;
}

#TopMiddleWrapper {
    width: 916px;
    height: 100%;
    margin-left: -124px;
    min-height: 580px;
    height: auto !important;
    height: 580px;
}