2012-05-11 200 views
0

這應該是非常簡單的,我認爲我做的是正確的......顯然不是。div盒內另一個div

我需要將「測試」的淺灰色框放入左側列表右側較暗的灰色區域。它的高度應該是270px(或其他),並且可以延伸到左側列表的右側邊緣和右側封閉容器的邊緣。我的代碼是Fiddle。十分簡單。謝謝,夥計們和女孩們。

回答

0

float: left;添加到您的revision-gutter班,這應該讓你開始。

+0

嗯,這很容易。謝謝,柯比先生。 – Jon

3

有兩種方法可以解決該問題,這源於您使用float: right。您可以1)將側邊欄上方的.theater灰色框移動,並將其正確地浮到其右側,或者2)您可以將邊欄更改爲float: left,從灰色框中移除浮動塊,並添加左邊距。

Here's an example of the second approach.

你也可以浮動兩個側欄和灰色框,但我不會建議。

1

只需添加float:left;.revision-gutter和你做!

你的CSS應該

.revision-gutter { 
    width:270px; 
    height:inherit; 
    background-color:#333333; 
    overflow-y:scroll; 
    float: left; 
} 

updated Fiddle!

+0

看看[this ...](http://jsfiddle.net/zuul/f8yLh/3/)或許它是你的最終目標! – Zuul