html - divの子要素をセンタリングする

Question

次のjs-fiddleがあります。基本的にdivは、たくさんの正方形の子要素を持つ単なる です。問題は、divが常に中央にあるとは限らないことです。私はすでに以下を設定しましたCSS：

.boutique-grid {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

子要素の div を中央に配置しない理由がわかりません。何か案が？

Answer 1

.boutique-grid {
    text-align: center;    
}

.boutique-grid-column {
    ...
    margin: 0 auto;    
}

Answer 2

削除するfloat:left;と、これは正常に機能します。すでにdisplay:inline-block;設定されているため、要素をフロートする必要はありません。

http://jsfiddle.net/wy7rd/3/

Answer 3

は中央にありますboutique-gridが、幅は 100% です。たとえば、幅を 710px に設定できます。

.boutique-grid {
  overflow: hidden;
  width: 710px;
}