2013-09-23 17 views
9

ただ一つのことをクリアしたい。私は"container-fluid"クラスを使用していた場合、それは私がbootstrap.cssにこのような何かを持つことはできませんを意味しますTwitter Bootstrap "container-fluid"

.container-fluid{ 
width: 1170px; 
} 

私は、ピクセル単位で設定しようとしましたが、応答性の性質は、単にオフ。 %で設定している間は動作します。言い換えれば、私の質問は次のようなものです: コンテナ流体の固定幅はどのようにして設定できますか?それとも、ブートストラップ開発者がデフォルトで意図したものではないのでしょうか?

私はすでにこのリンクをお読みください。 Fluid or fixed grid system, in responsive design, based on Twitter Bootstrap

をしかし単にpx幅を設定container-fluid.

+0

応答性とは、幅がビューポートサイズで決定されることを意味します。パーセンテージでも幅を指定すると正しくないことがあります。なぜなら、デバイスによっては何とか歪んでしまい、最大幅を使うほうが良いからです。 – Amit

答えて

18

と応答性の性質や固定幅に関してはそこに何かが、それは静的作っている、あなたが採用する必要があります見つけることができませんそれ以降に応答するようにするには、javascriptのように、%を使用する理由があります。

あなたは、コンテナは、ユーザーの画面には、コンテナだけ広い1170pxまで行きます1170pxよりも広くなっているので、もし、最大幅がそれを行います

.container-fluid { 
    max-width:1170px; 
} 

1170px使用よりも広い行かない作りたいと思っている場合。これにより、反応するメカニズムがまだ機能するようになります。

もちろん、セレクタとして.container-fluidを使用すると、すべてのcontainer-fluid要素がどのように動作するかが変わります。その要素に2番目のクラスを追加し、そのスタイルを設定することを検討してください。

HTML

<div class="container-fluid maxWidth"></div> 

CSS

.maxWidth { 
     max-width:1170px; 
} 

あなたは、彼らが言うことができないだろうと非応答内のコンテンツを作成することを、どんな固定しないことがコンテナを希望している場合コンテナのサイズが変更されないため、画面のサイズが変更されたとき。