UL标签不以保证金为中心：0自动; css风格

我正在尝试创建将位于div中心的寻呼机.基本上代码看起来像这样：

<div class="cms-pager">
       <ul>
             <li>1</li>
             <li>2</li>
             <li>3</li>
       </ul>
   </div>

如果我像这样指定CSS：

.cms-pager {  } 
  .cms-pager ul { background-color: somecolor; margin: 0 auto; }
  .cms-pager ul li { padding: 5px; margin: 3px; }

然后UL不会居中,因为它在整个div上都有宽度/背景颜色.我不会工作.

如果我像这样指定CSS：

.cms-pager {  } 
  .cms-pager ul { width: 200px; background-color: somecolor; margin: 0 auto; }
  .cms-pager ul li { padding: 5px; margin: 3px; }

然后UL以页面为中心.问题是我必须指定固定宽度：200px;如果我只有1或2个链接,它就在中心位置.所以这对我来说不合适,我需要UL真正拥有实际LI标签的宽度并且要按宽度精确指定.

如果我像这样指定CSS：

.cms-pager { margin: 0 auto; } 
  .cms-pager ul { float: left; background-color: somecolor; margin: 0 auto; }
  .cms-pager ul li { padding: 5px; margin: 3px; }

然后UL背景在LI 1 – 3下是灰色的.所以我知道大小是好的.但是因为我必须使用float：left style它会自动对齐到left并忽略div margin：0 auto style;

如果我像这样指定CSS：

.cms-pager { margin: 0 auto; text-align: center } 
  .cms-pager ul {background-color: somecolor; margin: 0 auto; display: inline-block; }
  .cms-pager ul li { padding: 5px; margin: 3px; }

此版本适用于Firefox,Chrome但不适用于IE6 / 7,因为它无法正常使用内联块;

有没有解决这个问题的方法？唯一的解决方案是使用像表tr td这样的不同标签,还是可以用这个来完成任何事情？

解决方法

这够近了吗？没有浮动,没有内联块.只是简单的’块和对齐.

.cms-pager,.cms-pager ul {
    margin: 0 auto;
}

.cms-pager {
    text-align: center;
}

.cms-pager ul li {
    display: inline;
    width: 10px;
    background-color: gray;
    padding: 5px;
}

Here’s a preview.