ブートストラップグリッドが積み重なる（評価バー）

Question

私が画面を縮小すると、3番目の列が積み重なってしまいます。私は横に3つのファッションが欲しい。助けてください
実際には、画面の幅が358pxになると起こります。

コード：

<div class="container"> 
     <div class="row"> 
      <div class="col-xs-1 col-sm-2 col-md-2 col-lg-2"> 
       <h5 class="text-right"> 5* </h5> 
       <h5 class="text-right"> 4* </h5> 
       <h5 class="text-right"> 3* </h5> 
       <h5 class="text-right"> 2* </h5> 
       <h5 class="text-right"> 1* </h5> 
      </div> 
      <div class="col-xs-10 col-sm-8 col-md-8 col-lg-8"> 
       <h5> Research </h5> 
       <h5> Research </h5> 
       <h5> Research </h5> 
       <h5> Research </h5> 
       <h5> Research </h5> 
      </div> 
      <div class="col-xs-1 col-sm-2 col-md-2 col-lg-2"> 
       <h5> 50 </h5> 
       <h5> 49 </h5> 
       <h5> 38 </h5> 
       <h5> 25 </h5> 
       <h5> 12 </h5> 
      </div> 
     </div> 
     </div> 

Answer 1

これはknown issue with Bootstrapですが、それは "固定" することができるものではありません。

列のいずれかの側に15pxのパディングがあり、最小の列単位（col-xs-1）の幅はわずか8.333％です。最終的に画面の幅が狭すぎて列が折り返されます。

簡単な回避策は、パディングを削除することです：

.no-padding { 
    padding: 0; 
} 

http://www.codeply.com/go/8OVFsrGPJg