グリッドカラムを整列する方法（col-md-4＆col-md-8）

Question

私は、画像が左側にあり、右側にユーザ​​の詳細があるユーザプロファイルページを作成するためにブートストラップを使用しています側。

私は次のようにそれを使用します。ユーザーの画像の下

<div class="row"> 

     <!-- Col 1 --> 

     <div class="col-md-4 col-xs-6"> 
      <div> 
       <img ..> 
       <h2>Name of the user</h2> 
       Sample text<br> 
       <a href="#"><img src="..."></a> 
       <a href="#"><img src="..."></a> 
      </div> 
     </div> 

     <!-- Col 2 --> 

     <div class="col-md-4 col-xs-6"> 
      <div> 
       <ul class="nav nav-tabs" role="tablist"> 
        <li>...</li> 
       </ul> 
      </div> 
     </div> 
</div> 

、それは、彼/彼女の名前を持つコミュニティの彼/彼女の積極的な参加が続き、その後、リンクが続きます彼/彼女のソーシャルメディアに。

デスクトップで見ると、見栄えがよくなります。ただし、モバイルデバイスで表示しようとすると、最初の列のコンテンツ全体が左に揃えられます。私はそれが適切に見えるように中心を揃えたい。どうやってやるの？それとも私は間違いをしていますか？あなたが必要とする

Answer 1

クラスがdiv要素でcol-xs-4 CSSクラスを配置しようとするとcenter-block

Answer 2

です：

<div class="col-md-4 col-xs-4"> 

この方法では、モバイル機器での動作は、デスクトップと同じになります。