动态使两个浮动div具有相同的高度答案

【问题标题】：make two floating divs the same height dynamically动态使两个浮动div具有相同的高度
【发布时间】：2011-10-23 15:24:36
【问题描述】：

情况：我有一个容器，里面有两个直接的孩子，我们称他们为 left 和 right。
left 绝不应允许超过 right 的 height，但是应该允许 right 超过 height 个，共左。

我不知道如何用 CSS 做到这一点（希望同时保持我的标记的简单性）

示例 html

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

示例css

.wrapper {
    display: inline-block;
    margin: 10px 0;
}
.left {
    float: left;
    width: 60px;
    background-color: #999;   
}
.right {
    float: left;
    width: 540px;
    border: 4px solid #666;
    padding: 8px;
}

or see what I mean here

【问题讨论】：

我假设这可能很简单......我只是在寻找错误的东西吗？？

标签： html css css-float

【解决方案1】：

这是一个常见的问题。问题是，您需要 CSS/背景图像技巧或使用 javascript。一种常用的是Faux Columns。

【讨论】：

+1 用于人造列。这是一种遵循渐进增强原则的常见健壮模式。
它们在你家也很好看！

【解决方案2】：

是的，这种问题你需要依赖 JavaScript，你总是可以根据右列的高度来设置左列的最小高度，或者类似的东西！

使用 jQuery，这可能会帮助您入门！ http://www.cssnewbie.com/equal-height-columns-with-jquery/

【讨论】：

给你检查静态*min-*height（我假设你的意思是说min而不是max）