divを水平に維持する

Question

私はブートストラップをうまく持っていて、その井戸の中に "parent"という名前の要素を持つdivがあります。親はお互いに左に浮いている。 divが4つの親にフィットする大きさであれば、4つの親を一列に、他のものを2番目にフィットさせるなど、3つに収まるほど大きければ、1つの行に3つ入る...（サイズは画面の幅に依存する）。この問題は、divが3、半分の親、または4と20pxのように大きい場合に表示されます。その後、場所の左があなたが絵に見ることができるように余裕が充填されている：

はどのようにして、水平方向だけでなく、ブートストラップの内側を中心と両親とのdivを保つことができるので、偏在余裕があることはありません。余白は常に左右で同じにする必要があります。コードはここにある（ウェルは両親と伸びるように、明確なdiv要素を無視し、それだけで、両親のフロートを助ける）：

/* Some CSS to make the result easier to follow */ 
 
.parent { 
 
    background-color: white; 
 
    outline: 1px solid black; 
 
}

<!-- Latest compiled and minified CSS --> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 
<div class="well" style="padding: 2em 0;"> 
 
    <div class="profile-exams"> 
 
    <div class="parent" style="float: left; width: 200px" margin="10px;">parent div </div> 
 
    <div class="parent" style="float: left; width: 200px" margin="10px;">parent div </div> 
 
    <div class="clear" style="clear: both;"></div> 
 
    </div> 
 
</div>

問題は、私は、静的に設定することができないということです2つ、3つ、または5つのボックスが内部にある場合は、「プロファイル試験」の幅が異なります。しかし、私が幅を定義することができない場合、それは中心にはなりません。

Answer 1

これはあなたが望むものである場合、私はわからないんだけど、ここにある：

.profile-exams { 
 
    text-align: center; 
 
} 
 
.parent { 
 
    text-align: left; 
 
/* These lines aren't necessary, but just to make the result easier to follow */ 
 
    background-color: white; 
 
    outline: 1px solid black; 
 
}

<!-- Latest compiled and minified CSS --> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 
<div class="well" style="padding: 2em 0;"> 
 
    <div class="profile-exams"> 
 
    <div class="parent" style="display: inline-block; width: 200px" margin="10px;">parent div </div> 
 
    <div class="parent" style="display: inline-block; width: 200px" margin="10px;">parent div </div> 
 
    <div class="clear" style="clear: both;"></div> 
 
    </div> 
 
</div>

CodePen