html - 使两个子 DIV 与单个父 DIV 的高度相匹配？

Question

我在一个主要用于教育目的的网站上工作。当谈到设计某些东西时，我有点强制症，喜欢它是完美的；)。我遇到了一个我自己似乎无法解决的问题，所以我希望你们中的一些人可以提供修复或知道一个涵盖此类问题的网站。

在那里我有父 DIV 和两个子 DIV...

<div id="container">
    <div id="container-left"></div>
    <div id="container-right"></div>
</div>

两个子 DIV 都有自己的内容，并且高度各不相同。我的网站设计方式 #container-right 的高度必须等于或大于 #container-left 才能使设计看起来正确。

这是网站的链接:www.lulzorg.com/?p=w7ws8

这是一个显示我的意思的网站截图:skiroid.com/website_capture.jpg

感谢您的宝贵时间! :D 有什么问题吗？请教!

Answer 1

几种方式:

#container { height: 100px; }
#container div { height: 100%; }

或

#container { display: table; }
#container div { display: table-cell; }

http://jsfiddle.net/