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:

Stylesheet

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

HTML
HTML:

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

       

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

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

HTML

HTML:

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