2012-11-26 71 views
0

我在我的CSS佈局中遇到問題,其中包含兩列的容器。下面顯示了兩列的CSS。液體高度div

#project-desc{ 
    float: left; 
    width: 500px; 
} 

#project-images{ 
    float: right; 
    width: 300px; 
} 

我必須將它們浮起來,因爲我不知道如何使左右兩列粘在一起。

問題是,根據project-desc中的內容自動調整其高度。但是,容器並未相應地調整其高度,使得內容物遠離實際容器。容器代碼如下。

#project-space{ 
    margin: 10px auto; 
    padding: 5px; 
    width: 800px; 
    height: 100%; 
    min-height: 250px; 

    background: -webkit-gradient(linear, 0% 20%, 0% 100%, from(#fff), to(#fff), color-stop(.2, #f2f2f2)); 
border: 1px solid #ccc; 
-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3); 
} 

我想要的是讓容器根據其內容高度調整其高度。我嘗試從project-desc中刪除浮動選項,它工作。但是當我在項目圖像中添加一些東西時,它定位在項目描述的頂部。

我該如何解決這個問題。

回答

1

'clearfix'技巧通常應用於容器以實現您所期望的行爲。谷歌會很快找到你的執行情況,以及某種形式的解釋。

或者,您可以將容器本身左右浮動。