如何在窗口中制作Div-Wrapper中心？

Question

我的CSS：

包装器不会居中，它将向左或向右对齐。此外，我希望身体中的信息能够扩展高度，但它不会。

    var camera, scene, controls, renderer, sprite;

    function convertlatlonToVec3(lat, lon)
    {
        lat = lat * Math.PI / 180.0;
        lon = -lon * Math.PI /180.0;
        return new THREE.Vector3(
            Math.cos(lat)* Math.sin(lon),
            Math.sin(lat)* Math.sin(lon),
            Math.cos(lat));
    }

function labelBox(Ncardinal, radius, domElement)
{
    this.screenVector = new THREE.Vector3(0, 0, 0);
    this.position = convertlatlonToVec3(Ncardinal.lat, Ncardinal.lon).multiplyScalar(radius);


    //create html overlay box and clickable to url.. 
    this.box = document.createElement('div');
    a = document.createElement('a');
    a.innerHTML = Ncardinal.name;
    a.href ='http://www.google.de';
    this.box.className = "spritelabel";
    this.box.appendChild(a);


    this.domElement = domElement;
    this.domElement.appendChild(this.box);


}

labelBox.prototype.update = function()
{
    this.screenVector.copy(this.position);  
    this.screenVector.project(camera);

    var posx = Math.round((this.screenVector.x + 1)* this.domElement.offsetWidth/2);
    var posy = Math.round((1 - this.screenVector.y)* this.domElement.offsetHeight/2);

    var boundingRect = this.box.getBoundingClientRect();


    //update the box overlays position
    this.box.style.left = (posx - boundingRect.width) + 'px';
    this.box.style.top = posy + 'px';

};


function init() {

    var width = window.innerWidth;
    var height = window.innerHeight;

    renderer = new THREE.WebGLRenderer( {antialias:true} );
    renderer.setSize(width, height);

    document.body.appendChild(renderer.domElement);

    camera = new THREE.PerspectiveCamera(100, width/height, 1, 1000);
    camera.position.z = 1;

    scene = new THREE.Scene();

    controls = new THREE.OrbitControls(camera, renderer.domElement);
    controls.minPolarAngle = Math.PI/4;
    controls.maxPolarAngle = 3*Math.PI/4;


    var radius = 100;
    var spheregeometry = new THREE.SphereGeometry(radius, 30, 30, 0, -6.283);
    var texture = THREE.ImageUtils.loadTexture('churchtest.jpg');
    var spherematerial = new THREE.MeshBasicMaterial({map: texture});
    var sphere = new THREE.Mesh(spheregeometry, spherematerial);

    scene.add(sphere);

    var Ncardinal = {"name": "North", "lat": 0, "lon": 360};


    sprite =  new labelBox(Ncardinal, radius, document.body);


    var marker = new THREE.Mesh(new THREE.SphereGeometry(5, 30, 30));
    marker.position.copy(sprite.position);
    scene.add(marker);

    window.addEventListener('resize', onWindowResize, false);
}

function onWindowResize() {

    camera.aspect = window.innerWidth / window.innerHeight;
    camera.updateProjectionMatrix();
    renderer.setSize(window.innerWidth, window.innerHeight);

} 

function animate() {

        sprite.update();
        requestAnimationFrame(animate); 
        controls.update();
        renderer.render(scene, camera);
}

init();
animate();
}

我的HTML：

这些是我在HTML中使用的div。

html, body, #container{
    position: absolute;
    color: black;
    width: 100%;
    min-height: 100%;
    margin: 0;
    background-color: lightgrey;
}
#wrapper{
    position: absolute;  
    margin: 0 auto;
    width: 70%;
    background-color: white;

    border: solid 1px black;
}
#header{
    position: absolute;
    width: 100%;
    height: 250px;
    overflow: hidden;    

    border: solid 1px red;
}
#banner{
    position: absolute;
    height: 200px;
    width: 100%;    

    border: solid 1px blue;
}
#logoDiv{
    position: absolute;
    height:200px;
    width: 200px;

    border: solid 1px green;
}
#titleDiv{
    position: absolute;
    height: 200px;
    margin-left: 200px;
}
#navBar{
    width: 100%;
    margin-top: 200px;
    position: absolute;
    height: 50px;
    text-align: center;
    background-color: #333;
}
#content{
    margin-top: 250px;
    height: 9000px;
    min-height: calc(100%-250px-100px);
    width: 100%;
    background-color: aquamarine;
}
#body{
    padding: 0 50px;
    overflow-y: auto;      
    word-wrap: break-word;
    width: 100%;
}
#footer{
}

无法使内容扩展，因为正文div也会从文本扩展。