CSS:複数のDIVを同じ行の中央に表示する一つの実現方法


プロジェクト開発では,画面に複数のDIVの内容が1行に表示されることが多い.
例えばHTML
<div class="div_allinline">
	<div class="subdiv_allinline">
	   ,  div1    。
         <br>  ,  div1    
       </div>
	<div class="subdiv_allinline">
	   ,  div2    。
       </div>
       <div class="subdiv_allinline">
	   ,  div3    。
         <br>  ,  div3    
       </div>
</div>

どのようにして1行に中央に表示しますか?この処理はinline-blockを使用して行います.
<style type="text/css">

.div_allinline
{
    text-align:center;
    margin:0 auto;
    padding:0;
    clear:both;
 }

.subdiv_allinline
{
    margin:0;
    padding:0;
    display:inline-block;
    _display:inline;
    *display:inline;
    zoom:1;
}
</style>

IE 6,IE 7ではinline-blockがサポートされていないため,IE 6に対して,IE 7は以下の3つの属性を記述する.
    _display:inline;     *display:inline;     zoom:1;
これで主流のブラウザに正常に表示されるようです.divの幅は状況に応じて設定できます.