Question: > 
> **Possible Duplicate:**  
> 
> [How to align a <div> to the middle of the page](https://stackoverflow.com/questions/953918/how-to-align-a-div-to-the-middle-of-the-page) 
> 
> 
> 

I need is to show the content of a web page in the middle of the screen, no matter what screen size it is, big or small, resolution high or low, it always gets automatically adjusted to the middle of screen.

Answer: 
If you want to center the content horizontally and vertically, but don't know in prior how high your page will be, you have to you use JavaScript.

HTML:

```xml
<body>
    <div id="content">...</div>
</body>

```

CSS:

```css
#content {
    max-width: 1000px;
    margin: auto;
    left: 1%;
    right: 1%;
    position: absolute;
}

```

JavaScript (using jQuery):

```js
$(function() {
    $(window).on('resize', function resize()  {
        $(window).off('resize', resize);
        setTimeout(function () {
            var content = $('#content');
            var top = (window.innerHeight - content.height()) / 2;
            content.css('top', Math.max(0, top) + 'px');
            $(window).on('resize', resize);
        }, 50);
    }).resize();
});

```

[![Centered horizontally and vertically](https://i.stack.imgur.com/ABTtr.png)](http://jsfiddle.net/nBzcb/)

Demo: <http://jsfiddle.net/nBzcb/>
**HTML**

```
<!DOCTYPE html>
<html>
    <head>
        <title>Center</title>        
    </head>
    <body>
        <div id="main_body">
          some text
        </div>
    </body>
</html>

```

**CSS**

```
body
{
   width: 100%;
   Height: 100%;
}
#main_body
{
    background: #ff3333;
    width: 200px;
    position: absolute;
}​

```

**JS ( jQuery )**

```
$(function(){
    var windowHeight = $(window).height();
    var windowWidth = $(window).width();
    var main = $("#main_body");    
    $("#main_body").css({ top: ((windowHeight / 2) - (main.height() / 2)) + "px",
                          left:((windowWidth / 2) - (main.width() / 2)) + "px" });
});

```

See example [here](http://jsfiddle.net/darkking/z8pTa/)