画面サイズに基づいた.container-fluidのコンテナ

Question

ここでは、ブートストラップウィザードの課題です。スクリーンサイズに応じて.containerと.container-fluidの間でレイアウトを交換する方法です。私。私は液体が欲しい、そうでなければ通常のコンテナを使います。

<!-- pseudo class definition to exemplify --> 
 
<div class="container-fluid-xs-only container-sm-and-up"> 
 
    
 
    <div class="row"> 
 
    ... 
 
    </div> 
 
</div>

免責事項：私は今やっている回避策は、メディアクエリを使用して余白を微調整されます。私。 .containerを使用し、モバイルに負のマージンを追加する。これを達成するより良い方法があるかどうか分かります。

要件：理想的には私は純粋にCSSベースのソリューションを望んでいますが、実際には不可能な場合は、角度1.xを使用していると考えてください。

PS：私は「行」内、他の言葉で、私は重複コンテンツと.visible-XSと.hidden-XSを行うことに興味がないんだけどいただきまし複製したくない...

ありがとう！

Answer 1

containerとcontainer-fluidの唯一の違いは、幅です。そのため、子要素（行、列など）はいずれも同じように動作します。

containerはまったく同じように動作container-fluid画面で768px未満の幅ように、デフォルトでxs画面上container全幅（100％）になると。変更する必要はありません。単にcontainerを使用してください。

http://codeply.com/go/8ei2hMKBKd