複数の子供を中心に並べるDIV

Question

私はこの問題を回避するにはちょっと混乱しています。

私は親DIVと3つ以上の子DIVを持っています。

親DIVは中央揃えで、子DIVは左に浮動している必要がありますが、中央に揃える必要があります。 CSSが含まれてい

、

.center { float:left; height:250px; width:15%; margin: 0 auto; border: 1px solid black; } 

I have a sample of the code link here...

Answer 1

要素を中央で水平に整列させたい場合は、フロートしないでください。

変更彼らはinline-blockに表示され、その親のtext-alignスタイルを変更することにより、中央にそれらを合わせている方法：

#parent { 
 
    text-align:center; 
 
    height:450px; 
 
    width:75%; 
 
    border:1px solid blue; 
 
} 
 
.center { 
 
    display:inline-block; 
 
    height:250px; 
 
    width:15%; 
 
    margin: 0 auto; 
 
    border: 1px solid black; 
 
}

<div id="parent"> 
 
    <div id="child1" class="center"></div><!-- 
 
--><div id="child2" class="center"></div><!-- 
 
--><div id="child3" class="center"></div> 
 
</div>

は、ホワイトスペースや改行全くないようにしてくださいあなたの子供の間で<div>（あなたのHTMLで、それは）またはそれをコメントアウトしてください。これがのインライン要素であるため、この空白はスペースとして解釈されます。

Answer 2

自動マージンが適用フロートを持っている要素には適用されません。浮動小数点数を削除すると、最初に起動するはずです...