The following code will completly center your page.
#horizon
{
color: white;
background-color: #0ff;
text-align: center;
position: absolute;
top: 50%; /* positioned absolutely 50% from the top */
left: 0px;
width: 100%; /* 100% wide */
height: 1px; /* nominal height of 1px */
overflow: visible; /* overflow is set to ‘visible’ */
visibility: visible;
display: block
}
#content
{
font-family: Verdana, Geneva, Arial, sans-serif;
background-color: #f00;
margin-left: -125px; /* negative margin that is exactly half of its width */
position: absolute;
top: -35px; /* negative top position that is exactly half of its height */
left: 50%; /* positioned absolutely 50% from the left */
width: 250px;
height: 70px;
visibility: visible
}
____
[div id=”horizon”]
[div id=”content”]
This is the centered box
[/div]
[/div]
