CSS Нижний колонтитул нижний центр вопрос

Question

Эй, все, я пытаюсь получить нижнюю панель, чтобы сосредоточиться на экране, но я не могу этого сделать.

<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> 

Спасибо!

Дэвид

Answer 1

Ok я получил его, добавив в моем CSS:

left:0; 
right:0; 

Answer 2

Попробуйте это:

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

Answer 3

Я думаю, единственное, что вам нужно изменить, чтобы удалить left: 0px; линию. Эта строка заставляет div находиться в самом левом пикселе содержащего его элемента. Поскольку вы просто хотите, чтобы он был центрирован, margin: 0 auto; должен сделать это для вас с удалением одной строки.