正确的HTML对齐/调整两个相邻的50％宽度/相等高度的字段集，其宽度低于100％？

Question

我想布置一个这样的区域：

---- ----
|A | |B |
|  | |  |
---- ----
---------
|C      |
---------

其中三个方框中的每一个都是<fieldset>。方框A和方框B可能由不同数量的项目填充，但它们应该都是相同的高度（需要更大的高度）。

方框C应为100％宽度，位于它们正下方。

实现此目的的最佳/最佳HTML / CSS / JS是什么？

编辑：我忘了在字段集中添加可能的皱纹是“jEditable”，这样字段集高度可能会动态变化，而另一个字段集也需要调整大小。

Answer 1

A {
    float:left;
    width:50%;
}

B {
    overflow:auto;
}

C {
    clear:left;
}

不知道你是否想要更多？

Answer 2

我没有使用浮点数，而是像这样解决了它：

fieldset.sidebyside
{
    width: 48%;
    display: inline;
    vertical-align: top;
}

使用看起来像这样的HTML结构

<div class="sidebyside">
    <fieldset class="sidebyside"> ... </fieldset>
    <fieldset class="sidebyside"> ... </fieldset>
</div>

“平等身高”问题有很多种方法，详见博文：http://www.ejeliot.com/blog/61。

我最终成功使用了这个特定解决方案的个性化变体，它使用jQuery来使用min-height调整（并调整大小）div： http://www.filamentgroup.com/lab/setting_equal_heights_with_jquery/