php - 液体高度格

标签 php html css css-float

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

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

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

我必须让它们 float ,因为我不知道有什么方法可以让两列粘在左边和右边。

问题是,根据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 中删除 float 选项并且它起作用了。但是当我向元素图像添加一些东西时,它位于元素描述的顶部。

我该如何解决这个问题。

最佳答案

“clearfix”技巧通常应用于容器以实现您想要的行为。 Google 会很快为您找到对此的实现,以及某种形式的解释。

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

关于php - 液体高度格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13559831/

相关文章:

php - Laravel NotFoundHttpException 处理

Play Framework 1.3.x 中的 PHP 查询

php - 为什么sql查询不执行?

html - 空段落标签 - 我是否应该允许在 HTML 编辑器中使用?

html - 环形工艺微调器,在环周围具有渐变渐变效果

google-chrome - 使用背景大小 : cover 的 Chrome 性能不佳

html - 修复 HTML 中的左右浮动图像

javascript - 将php数据发送到javascript点击事件

javascript - 侧边栏在桌面上默认打开,在移动设备上关闭

jquery - 一次加载多个幻灯片