Question

我尝试使用bootstrap进行不常见的布局，但是以一种奇怪的方式拉动和推送工作。看看它：

<div class="container" style="background: white">
  <div class="row">    
    <div class="col-xs-3" style="background: red; height: 300px;">catalog</div>
    <div class="col-xs-9" style="background: blue; height: 50px;">bNNER</div>
    <div class="col-xs-3 col-xs-push-6" style="background: yellow; height: 500px;">News</div>        
    <div class="col-xs-6 col-xs-pull-3" style="background: green; height: 280px;">Catalog</div>
    <div class="col-xs-6 col-xs-pull-6" style="background: pink; height: 100px;">Promo</div>               
  </div>
</div>

我需要粉红色的促销块9个宽度，但是如果我把它变宽6，它就属于新闻块。

Answer 1

我改变了一点订单，黄色新闻向右浮动。我也删除了所有不必要的拉动和推动。结果如下：

http://jsfiddle.net/tfgdveop/3/

<div class="container" style="background: white">
    <div class="row">    
        <div class="col-xs-3" style="background: red; height: 300px;">catalog</div>
        <div class="col-xs-9"style="background: blue; height: 50px;">bNNER</div>     
        <div class="col-xs-6"style="background: green; height: 280px;">Catalog</div>
        <div class="col-xs-3 pull-right"style="background: yellow; height: 500px;">News</div>    
 <div class="col-xs-9" style="background: pink; height: 100px;">Promo</div>              
    </div>
</div>

这是你在找什么？

Bootstrap布局与神秘拉扯和推动

1 个答案: