マージンを使用しないULタグ：0 auto; CSSスタイル

Question

私はdivの中央に座るポケットベルを作成しようとしています。それが全体のdiv全体幅/背景色を持っているよう

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

その後、UL習慣センター：私はこのようなCSSを指定した場合

<div class="cms-pager"> 
     <ul> 
      <li>1</li> 
      <li>2</li> 
      <li>3</li> 
     </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つのリンクを持っている場合、それはまさに中心にあります。だから、これは私のためのものではありません、私は本当に実際の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の下に灰色である - だから私はサイズがOKである知っている3。しかし、私はfloat：leftスタイルを使用しなければならなかったので、それは自動的に左に揃えられ、divマージンは無視されます：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の、クロムのために働く

ないIE6/7のために、それはインラインブロックで正常に動作doesntのよう。

この問題の解決方法はありますか？テーブルtrのようなdiffentタグを使用する唯一のソリューションは何ですか？これで何かできますか？

Answer 1

これで十分ですか？浮動小数点数なし、インラインブロックなし。ちょうど平らなオールのブロックと整列。

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