0

我的 CSS 布局有问题,我有一个包含两列的容器。两列的 CSS 如下所示。

 #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 中删除浮动选项并且它有效。但是当我向项目图像添加一些东西时,它位于项目描述的顶部。

我该如何解决这个问题。

4

1 回答 1

1

“clearfix”技巧通常应用于容器以实现您想要的行为。谷歌会很快找到你的实现,加上某种形式的解释。

或者,您可以将容器本身向左或向右浮动。

于 2012-11-26T08:28:28.757 回答