4

Bootstrap 3 で応答性を無効にした後、列の順序付けに問題があります。

<div class="row">
    <div class="col-xs-9 col-md-push-3">...</div>
    <div class="col-xs-3 col-md-pull-9">...</div>
</div>

そうすると、1024 未満の解像度のレイアウトに影響します - ブロックの場所が変わります。このような別のソリューションを試しました...

<div class="row">
    <div class="col-xs-9 col-xs-push-3">...</div>
    <div class="col-xs-3 col-xs-pull-9">...</div>
</div>

...そしてこれ...

<div class="row">
    <div class="col-md-9 col-md-push-3">...</div>
    <div class="col-md-3 col-md-pull-9">...</div>
</div>

...そしてどれも正しく動作しません。

応答性を無効にして、col-9 ブロックを HTML ドキュメントの最初に配置し、任意の解像度で col-3 をその後に配置したいだけですが、col-3 ブロック (サイドバー) は左に配置し、col-9 ブロック (メイン コンテンツ) は左に配置する必要があります。右揃えにする。助言がありますか？

4

1 に答える 1

4

Also read http://getbootstrap.com/getting-started/#disable-responsive and /or try maybe. https://github.com/bassjobsen/non-responsive-tb3. Using the col-xs-* classes seems right (cause they never stack). The xs grid don't have pull, push and offset classes.

Add an float right seems a solution in your case:

<div class="container" style="background-color:white;">
    <div class="row">
    <div class="col-xs-9" style="background-color:red;float:right;">Right</div>
    <div class="col-xs-3" style="background-color:yellow;">Left</div>
    </div>
    <div class="row">
    <div class="col-xs-9" style="background-color:green;">Right</div>
    <div class="col-xs-3" style="background-color:blue;">Left</div>
    </div>
</div>
于 2013-09-24T18:43:37.253 に答える