CSS Center Web Page Using Styles Sheets

How to center a fixed box container using CSS? The sample below dose a few things. First it centers all body content  using the body tag text-align center attribute. This is done to fix a bug in IE and other browsers that do not support margin auto styles. Next thing it will do is take your div with an id of “container” and auto center the margin with a width of 900 pixels. You can change the width to match your content as needed. Lastly it will reset the text to align left. You can align the text as you see fit but here we just wanted to make sure it set back to the default Firefox & Safari text alignment.

Place the following code in your styles tag.

body
{
text-align: center;
}

div#container
{
margin-left: auto;
margin-right: auto;
width: 900px;
text-align: left;
}

You may also like...

Leave a Reply