純粹的CSS解決方案堆疊div的列

Question

我想將一個側邊欄div放在兩個堆疊的div旁邊，右側浮動。

您可以在這裏找到代碼： http://jsfiddle.net/okcomputer82/ED4WJ/2/

我敢肯定，我可以通過分組左側的div做到這一點，但我想知道是否有一個更清潔的方式。

謝謝。

Answer 1

從css class .left中刪除"clear: both;"，這樣就可以了。

NEW update class .left to「clear：left;」

.left { 
    float: left; 
    clear: left; 
    background: yellow; 
} 

，並把你的右格是在第一個地方像下面

<div class="content"> 
     <div class="right"></div> 
    <div class="left"></div> 
    <div class="left"></div> 

</div> 

例如：http://jsfiddle.net/ED4WJ/5/

Answer 2

<div class="content"> 
    <div class="left"></div> 
    <div class="left"></div> 
    <div class="right"></div> 
</div> 

CSS

.content 

{ 
    Float:left; 
    width:960px; 
    height:100px; 

} 

.left 
{ 
float:left; 
width:40%; 
height:100%; 
background-color:red 
} 

.right 
{ 
    float:left; 
    width:20%; 
    height:100%; 
    background-color:yellow 

}