ブートストラップのdivカラムを中心にする方法

Question

私はブートストラップdivを持っています。これは、条件に基づいて3つのカラムまたは2つのカラムまたは1つのカラムを持つことがあります。列の数が少ないので、それらを外側のdivに配置する必要があります。どうすれば達成できますか？条件に基づいて

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 

 
    <div class="col-lg-12"> 
 
    <div class="col-lg-4">1</div> 
 
    <div class="col-lg-4">2</div> 
 
    <div class="col-lg-4">3</div> 
 
    
 
    </div>

、私は唯一のdiv 1および2、または1つだけ、またはすべての1,2,3がある場合があります。列に関係なく常にdivの位置を中央に置くことができる方法はありますか？そして、外側のdivに左

Answer 1

使用ブートストラップのtext-centerクラスにそれらをフロート状態にしない：

<div class="col-lg-12 text-center"> 

Answer 2

これは簡単な方法になります。これはどこでも動作します。

CSS：

.col-lg-4 { 
    margin: 0 auto; 
} 

それとも、（私はここでそれを使用する理由を見ない）フレキシボックスを使用することができます。

.col-lg-12 { 
    display: flex; 
    justify-content: center; 
} 

Answer 3

あなたはCOL-MD-4 COL-MD-オフセット-4を使用することができます..あなたが中心になりたい行に

.row.col-centered > [class*='col-'] { 
    display: inline-block; 
    float: none; 
} 

http://www.codeply.com/go/p2L9Q6NKip