Centering your website

Centering your website

This tutorial with guide you through how to make a center your website of the users browser.

To do this we will create a container using a DIV. This will allow us to control the whole site as a block.

For our CSS code we need to set the width of the layout and the code to center our layout.

#container {
margin-left: auto;
margin-right: auto;
width: 760px;
text-align: center;
}

The margins set to auto makes both margins the same which in turn centers the layout, but this only works in non IE browsers. To get the centering to work in IE we need to add the text-align attribute.

The problem with adding the text-align attribute is that it can change the text alignment inside the container, so you may need to realign text within the container.