2009
11.12
11.12
Centering a fixed width div is relatively easy
div#Foo {
margin: 0 auto;
left: 0;
right: 0;
width: 500px;
position: absolute;
}
margin: 0 auto;
left: 0;
right: 0;
width: 500px;
position: absolute;
}
Just place this in positioned box and that’s all.
But if the thing is gonna be variable width, it’s a little bit more complicated.
* Put your content in a floated div, and give it a left: -50%, make it relative:
{
position: relative;
float: left;
left: -50%;
}
position: relative;
float: left;
left: -50%;
}
* Put this div in another floated div, and this time with:
{
position: relative;
float: left;
left: 50%;
}
position: relative;
float: left;
left: 50%;
}
Voila!
source: http://www.tightcss.com/centering/center_variable_width.htm