Bootstrap等于DIV高度以防止重叠

Question

我使用bootstrap 3.下面是我的布局。如何使w和x的底层相等，以便y不会重叠xs？

                                     

  <div id="rx"> 
    <div class="row-fluid">
      <div class="span12"></div>
    </div>

    <div class="col-xs-8 col-sm-push-2 col-sm-7 col-md-push-4 col-md-5">
      <!--DIV W-->
    </div>

    <div class="col-xs-4 col-sm-push-2 col-sm-3 col-md-push-4 col-md-3"> 
      <!--DIV X-->
    </div>

    <div class="col-xs-12 col-sm-pull-10 col-sm-2 col-md-pull-8 col-md-4">
      <!--DIV Y-->
    </div>

    <div class="col-xs-12 col-sm-12 col-md-12" id="nk">
      <!--DIV Z-->
    </div>
  </div> 
</div> 

示例： 在xs DIV中y从x的底层开始。因此y重叠w

Answer 1

只需将w和x打包成一行，然后将min-height添加到w和x，如下所示：

.wbox {
    background-color: #333;
    min-height:100px;
}
.xbox{
    background-color: #FFF;
    min-height:100px;
}

这是一个小伙伴：https://jsfiddle.net/e0d8my79/28/

此外，除非您仍在使用Bootstrap v2，否则在Bootstrap v3 +中不推荐使用 row-fluid 。只需在容器流体中保持正常行即可达到您想要的效果。