CSS Footer bar bottom center issue

Hey all, i am trying to get my bottom bar to center on the screen but i am unable to do so.

<style type="text/css"> 
body {
background: #fffff;
margin: 0;
padding: 0;
font: 10px normal Verdana, Arial, Helvetica, sans-serif;

}

* {开发者_开发问答margin: 0; padding: 0; outline: none;}

#bottomBar {
position: fixed;
bottom: 0px;
left: 0px;
z-index: 9999;
background: #e3e2e2;
border: 1px solid #c3c3c3;
border-bottom: none;
width: 500px;
min-width: 500px;
margin: 0px auto;
-moz-opacity:.90;
filter:alpha(opacity=90);
opacity:.90;
}

*html #bottomBar {margin-top: -1px; position: absolute;     top:expression(eval(document.compatMode &&document.compatMode=='CSS1Compat') ?documentElement.scrollTop+(documentElement.clientHeight-this.clientHeight) : document.body.scrollTop +(document.body.clientHeight-this.clientHeight));} 
#bottomBar ul {padding: 0; margin: 0;float: left;width: 100%;list-style: none;border-top: 1px solid #fff;}
#bottomBar ul li{padding: 0; margin: 0;float: left;position: relative;}
#bottomBar ul li a{padding: 5px;float: left;text-indent: -9999px;height: 16px; width: 16px;text-decoration: none;color: #333;position: relative;}
html #bottomBar ul li a:hover{  background-color: #fff; } 
a.PDF{background: url(http://www.xxx.com/img/pdficon.png) no-repeat center center;   }

</style>

<div id="bottomBar"> 
<ul id="mainpanel">     
    <li style="padding-top:5px; font-family:Arial, Helvetica, sans-serif; padding-left: 5px;">First time here? Be sure to check out the "this" button above or download the PDF here -></li> 
    <li><a href="http://www.xxx.com" class="PDF">Download PDF <small>Download PDF</small></a></li>   
</ul> 
</div> 

Thanks!

David

Ok i got it by adding this to my CSS:

left:0;
right:0;

I think the only thing you need to change is to remove the left: 0px; line. This line forces the div to be at the very leftmost pixel of its containing element. Since you just want it to be centered, the margin: 0 auto; should do that for you with that one line removed.

Try this:

#bottomBar {
position: fixed;
bottom: 0px;
z-index: 9999;
background: #e3e2e2;
border: 1px solid #c3c3c3;
border-bottom: none;
width: 500px;
min-width: 500px;
-moz-opacity:.90;
filter:alpha(opacity=90);
opacity:.90;
margin-left:auto;
margin-right:auto;
left:25%;
right:25%;
}