Css: How to center a variable width content

Centering a fixed width div is relatively easy

div#Foo {
   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%;
}

* Put this div in another floated div, and this time with:

{
   position: relative;
   float: left;
   left: 50%;
}

Voila.

source http://www.tightcss.com/centering/center_variable_width.htm

How to target non IE browsers

Internet Explorer alllows us to target its different versions with conditional comments:

But how to taget non-IE browsers is a little bit more tricky:

Mind the two extra "<!--"
That’s all!..

Source: http://www.cssplay.co.uk/menu/conditional.html