2016-08-05 3 views
0

私はcol-xs-offset-1を使用して、各列をxsスクリーン上のブロックスタイルのレイアウトに配置します。しかし、大画面では、私はcol-lg-offset-3を使って行をインラインで表示し、画面の中央に表示しています。これにより、col-xs-offset-1がcol-lgレイアウトをオーバーライドしているように見えるため、大画面の列はもはや中央に表示されなくなりました(図のリンクを参照)。これを引き起こしているのは何ですか?どのように私は両方の方法を持つことができますか? badges not centeredブートストラップコレートオフセット

<div class="container-fluid"> 
     <div class="row"> 
      <div class="list-group"> 
       <div class="col-xs-offset-1 col-xs-10 col-sm-offset-3 col-sm-2 col-md-offset-3 col-md-2 col-lg-offset-3 col-lg-2"> 
        <a href="http://hyperurl.co/cplq6c" class="list-group-item" target="_blank"> 
         <i class="fa fa-apple fa-2x" aria-hidden="true" style="color: whitesmoke;"></i>itunes 
        </a> 
       </div> 

       <div class="col-xs-offset-1 col-xs-10 col-sm-2 col-md-2 col-lg-2"> 
        <a href="http://hyperurl.co/1qcfl6" class="list-group-item" target="_blank"> 
         <i class="fa fa-amazon fa-2x" aria-hidden="true" style="color: #ff9900;"></i>amazon 
        </a> 
       </div> 

       <div class="col-xs-offset-1 col-xs-10 col-sm-2 col-md-2 col-lg-2"> 
        <a href="http://hyperurl.co/mb95g4" class="list-group-item" target="_blank"> 
         <i class="fa fa-google fa-2x" aria-hidden="true" style="color: #34a853;"></i>google play 
        </a> 
       </div> 
      </div> 
     </div> 
    </div> 

答えて

0

AブートストラップようCOL-XS-オフセット-1は、xsより大きい列に影響を与える、小から大まで適用されるオフセット。 col-sm-offset-0を追加すると、オフセットが大きな列に影響しないようにすることができます。