引导流体容器在正确的方向上自举框架流体容器的查询的点之后

Question

林。我附加了我想要创建的内容的视觉效果。我需要两列两列的流体，但我需要遵守标准容器规则的内容。我想保持它尽可能简单，没有复杂的CSS背景或渐变。

林希望这是一个简单的查询。我从来没有遇到过需要使用bootstrap做到这一点。

Answer 1

这是不可能的，因为所有的测量是在百分比制成，因此它们相对于被插入的父容器。

我的建议是放在哪里，你想真正留柱，然后将使这个真正的容器是绝对位置，浮于其他棕色和蓝色。

Answer 2

我会使用通常的自举容器和col-*然后使用绝对位置伪元件用于彩色块背景..

HTML

<div class="container border"> 
    <div class="row"> 
     <div class="col-sm-12"> 

     </div> 
    </div> 
    <div class="row margin-0"> 
     <div class="col-md-6 a"></div> 
     <div class="col-md-6 b"></div> 
     <div class="col-md-6 c"></div> 
     <div class="col-md-6 d"></div> 
    </div> 
</div> 

CSS

.a:after { 
    margin:0 15px 15px; 
    position:absolute; 
    content:""; 
    display:block; 
    background:#9999cc; 
    top:0; 
    right:0; 
    bottom:0; 
    z-index:-1; 
    width:200%; 
} 
.b:after { 
    margin:0 0 15px 0; 
    position:absolute; 
    content:""; 
    display:block; 
    background:#aa99cc; 
    top:0; 
    left:0; 
    bottom:0; 
    z-index:-1; 
    width:200%; 
} 
.c:after { 
    margin:0 15px 0; 
    position:absolute; 
    content:""; 
    display:block; 
    background:#cc2299; 
    top:0; 
    right:0; 
    bottom:0; 
    z-index:-1; 
    width:200%; 
} 
.d:after { 
    margin:0;  
    position:absolute; 
    content:""; 
    display:block; 
    background:#aaeecc; 
    top:0; 
    left:0; 
    bottom:0; 
    z-index:-1; 
    width:200%; 
} 

http://www.codeply.com/go/OAdlxM3jKb