div内の複数の要素の中央揃え

Question

ご挨拶、 私のリストの1つのページ設定パネルを作成しようとしています。

_____________________________ 
|   1 2 3   | 
------------------------------ 

あります：

<div class="panel"> 
    <div class="page">1</div> 
    <div class="page">2</div> 
    <div class="page">3</div> 
</div> 

だから私は基本的にdiv要素は、「パネル」コンテナの中央に行く「ページ」のすべて、このようにするためにしようとしている。現在、それは次のようになります（ページが3〜9ページあり、両方の状況が適切に処理されなければならない）幅を知らずにそのを実装する方法。

ありがとうございます。

Answer 1

にセンターを使用すると、ページが<div>秒になりたい何らかの理由はありますか？あなたがそれらを<span class='page'>（もっと意味的に正しいimhoです）にしてtext-align: center;をパネルに適用すると、あなたが望む効果が得られます。それ以外の場合は、ページ上でdisplay: inline;を実行することもできますが、そのためには<span>

Answer 2

数字にdivを使用する必要がありますか？

私の代わりにスパンでこれらのdivを交換し、その後、テキスト整列を適用する：outterのDIV（.panel）

Answer 3

となります。これは数字のリストなので、意味的に正しいものにすることを検討します。それらをULに変換し、CSSでスタイルを変えてください。このよう

<div class="panel"> 
<ul> 
    <li><a href="#">1</a></li> 
    <li><a href="#">2</a></li> 
    <li><a href="#">3</a></li> 
</ul> 
</div> 

そしてCSSでスタイル：ので、おそらく同様

.panel{text-align:center; } 
.panel ul{list-style-type:none; margin:0 auto; padding:0; overflow:hidden; } 
.panel li{display:inline; } 
.panel li a{padding:5px; margin:0;} 

は、パディングとマージンで遊んでみてください。改ページ、タブ、メニューでリンクを使用するときは、リンクに肥満を追加することをお勧めします。オペラ9、FF3、IE6でテスト

、クロム