価格表をブートストラップに集中させるには？

Question

私はBootstrapとスニペットを反応的な価格表に使用しています。次のコードを考慮して、2つの価格設定テーブルアイテムをどのように配置するのですか？私はtext-align（そして他のすべてのCSSアライメント属性）とhtmlのcenterタグとpタグを使ってみました。ただ、ここにあなたの最初の価格項目に

をcol-md-offset-3を追加

<div class="row"> 
     <div class="col-md-12"> 
      <div class="panel panel-default"> 
       <div class="panel-heading"><h2>Pricing</h2></div> 
       <div class="panel-body"> 
         <div class="col-xs-6 col-sm-6 col-md-3 col-lg-3"> 

          <!-- PRICE ITEM --> 
          <div class="panel price panel-red"> 
           <div class="panel-heading text-center"> 
            <h3>STANDARD PLAN</h3> 
           </div> 
           <div class="panel-body text-center"> 
            <p class="lead" style="font-size:40px"><strong>$49/week</strong></p> 
           </div> 
           <ul class="list-group list-group-flush text-center"> 
            <li class="list-group-item"><i class="icon-ok text-danger"></i> Unlimited 
            </li> 
            <li class="list-group-item"><i class="icon-ok text-danger"></i> 5GB/week bandwidth 
            </li> 
            <li class="list-group-item"><i class="icon-ok text-danger"></i> 24/7 support 
            </li> 
           </ul> 
           <div class="panel-footer"> 
            <a class="btn btn-lg btn-block btn-danger" href="/checkout.php">BUY NOW!</a> 
           </div> 
          </div> 
          <!-- /PRICE ITEM --> 


         </div> 

         <div class="col-xs-6 col-sm-6 col-md-3 col-lg-3"> 

          <!-- PRICE ITEM --> 
          <div class="panel price panel-blue"> 
           <div class="panel-heading arrow_box text-center"> 
            <h3>GOLD PLAN</h3> 
           </div> 
           <div class="panel-body text-center"> 
            <p class="lead" style="font-size:40px"><strong>$69/week</strong></p> 
           </div> 
           <ul class="list-group list-group-flush text-center"> 
            <li class="list-group-item"><i class="icon-ok text-info"></i> Unlimited</li> 
            <li class="list-group-item"><i class="icon-ok text-info"></i> 50GB/week bandwidth 
            </li> 
            <li class="list-group-item"><i class="icon-ok text-info"></i> 24/7 support</li> 
           </ul> 
           <div class="panel-footer"> 
            <a class="btn btn-lg btn-block btn-info" href="/checkout.php">BUY NOW!</a> 
           </div> 
          </div> 
          <!-- /PRICE ITEM --> 
         </div> 
       </div> 
      </div><!-- /panel --> 
     </div><!-- /.col --> 
    </div><!-- /.row --> 

Answer 1

はそれについてのブートストラップdocです。

Bootply：http://www.bootply.com/evwWXqxTBk

HTMLエキス：

<div class="panel-heading"><h2>Pricing</h2></div> 
<div class="panel-body"> 
     <div class="col-xs-6 col-sm-6 col-md-offset-3 col-md-3 col-lg-3">