ブートストラップxsカラムの折り返し

Question

最小のxsサイズの場合、カラムを12個まで追加しても、画面の幅が一定の制限を超えて小さくなると、期待通りに機能しません。例えば： - 私は最後の列は、画面の最後まで積み重ねられてしまいますサイズを小さくする場合

<div class="container"> 
    <div class="row"> 
      <div class="col-xs-2"> 
      </div> 
      <div class="col-xs-1 col-xs-offset-8> 
      </div> 
      <div class="col-xs-1> 
      </div> 
    </div> 

私は期待します。しかし、そうではありません。画面が一定の制限を超えて減少すると、最後の列が画面の先頭に向かって折り返されます。私はコンテナの最小幅を与えるためのCSSコードを書くことを考えました。しかし、私はブートストラップがこれを処理する良い方法を持っているかもしれないと思った。

Answer 1

これは既知の問題です：8.333333パーセントを：画面幅< 360pxでhttps://github.com/twbs/bootstrap/issues/13221

ので...

列が幅に設定されている間、.col-xs-1列は」ラップを開始; の列は、いずれの側でも1535xの埋め込みのため、少なくとも30pxの幅になります。したがって、不一致があり、ブラウザが の列をスタックすると、 " - @mdo

非常に小さな画面でcol-xs-1を使用しないと問題を回避できます。画面が現実的に360px未満にリサイズされるかどうかも検討する必要があります。ほとんどの場合、そうではありません。

Answer 2

それは私にとってはうまくいく。しかし、あなたのコードには閉じたdivといくつかの引用符がありません。

<div class="container"> 
<div class="row"> 
    <div class="col-xs-2"> 
    </div> 
    <div class="col-xs-1 col-xs-offset-8"> 
    </div> 
    <div class="col-xs-1"> 
    </div> 
</div> 
</div>