Not logged in - Login
< back

Center a <div> on a page.

How to center a <div> block horizontally on a web page.
References the following link: http://stackoverflow.com/questions/618097/how-do-you-easily-horizontally-center-a-div-using-css

Stylesheet

div.centered
{
       width: 200px;
       display: block;
       margin-left: auto;
       margin-right: auto;
}

HTML:

<div class=centered">Some text goes here</div>

In IE6 , you may need to add an outer div: Stylesheet

div.outerDiv
{
       text-align: center;
}
div.centered
{
       width: 200px;
       display: block;
       margin-left: auto;
       margin-right: auto;
}

HTML:

<div class="outerDiv">
       <div class="centered">The text to be centered</div>
</div>