3格動態安排與自舉3

Question

我目前有3 divs連續堆棧的順序red,​​,blue在xs設備。

在md設備，但是，我想blue放置右下方red如果red高度超過​​這不會發生。

這是佈局：

<div class="row"> 
    <div class="red col-md-6"> 
    <!-- content --> 
    </div> 
    <div class="green col-md-6"> 
    <!-- content --> 
    </div> 
    <div class="blue col-md-6"> 
    <!-- content --> 
    </div> 
</div> 

如果我把blue在一個單獨的row，將正義事業red後多餘的空格時​​高度比red高度。

Answer 1

試試這個：http://jsfiddle.net/U4Yer/

HTML：

<div class="row"> 
    <div class="col-md-6 col-xs-6 no-padd"> 
    <div class="red">content 1</div> 
    <div class="blue">content 1</div> 
    </div> 
    <div class="green col-md-6 col-xs-6 no-padd"> 
    Content 3 
    </div> 
</div> 

CSS：

.red { background: red; } 
.blue { background: blue; } 
.green { background: green; height:200px; } 
.no-padd { padding: 0; }