div內的中心內容

Question

我有以下標記。我試圖讓「前一個」一直到左側，「下一個」一直到右側，並且數字居中。我似乎無法讓數字居中。

我試過margin: 0 auto;對.numbers無濟於事。我最接近的是將.numbers上的左邊距設置爲40％左右，但這看起來很詭異，因爲上一個和下一個可能不總是在那裏，並且可能有多於或少於4個數字。我非常靈活的標記和CSS。

http://jsfiddle.net/dcsUc/15/

<div id="content"> 
    <div class="pagination"> 
     <div class="previous">Previous</div> 
     <div class="numbers"> 
      <a href="#">1</a> 
      <a href="#">2</a> 
      <a href="#">3</a> 
      <a href="#">4</a> 
     </div> 
     <div class="next">Next</div> 
     <div class="clear"></div> 
    </div> 
</div>​ 

而且

#content { 
    width: 100%; 
    border: 1px solid #000; 
} 

.previous, .numbers { 
    float: left; 
} 

.next { 
    float: right; 
} 

.clear { 
    clear: both; 
} 
​ 

Answer 1

移動div.next到div.numbers前的標記，不浮.numbers，並應用到text-align: center.numbers。

jSFiddle對於那些不認爲CSS誰;）

Answer 2

如果您想使用「保證金：0px auto的」你還可以設置爲DIV的寬度。