Here we are going to create a fixed-width Web page where everything will be centered
perfectly. Every time! I usually create my Web sites anywhere between 650-800px wide.
That way it will look pretty good, and have functionality across most different screen resolutions.
(But you may choose whichever size you would like.) But for this tutorial we'll use a width
of 800px. Height can be fixed, or 'auto'. I generally tend to leave height set to 'auto' if I'm
not exactly sure how many pixels my content is going to take up. When I do figure it out,
I usually set it to a fixed height, because it tends to render a bit better across multiple types
of browsers.

First we'll go to our CSS page. For the body, we'll automatically set the 'text-align' attribute to
center. This is going to align everything inside of the body (such as the bodyCenter div we are
about to use). Then we're going to set the 'position' attribute to relative. So that everything
inside of the body will relative to the body.





Next we're going to create a div named 'bodyCenter', which is going to hold the entire Web pages
content inside of itself. First, we'll set the width of the div to 800px; and the height to 'auto'. Position
on this will also be relative, which makes this div relative to the relative body. We'll set the top, and
left positions both to 0px, and because of our previous attribute of 'text-align: center' for the body,
that will place the div dead center of the browser window. And for the last stage of the CSS centering
we're going to give the 'margin-left', and 'margin-right' both 'auto'. That way the fixed width, along
with margin-left, and margin-right both pushing on each side, the div isn't going to go anywhere no
matter what. When your done, you should have something that looks like this.




The last part is the HTML, which should be something simple like this:




I hope this tutorial helps somebody, and if you have any questions, feel free to PM me. Thanks!