并排的div具有相同的高度

Question

如何放置并排DIV的高度？

当我更改浏览器的宽度时，有时左边的div会比左边更高或更短。

我希望左边或右边的div自动变成与另一个相同的高度。

设置显示表行是最佳解决方案吗？

看看我想要开发的页面的图像。 http://i.imgur.com/BhvV2.png

---

我使用display = table-row，table和table-cell解决了这个问题。我添加了一个div作为表格。 现在它很完美！看一看。

http://jsfiddle.net/tcWCC/47/

Answer 1

这是一个解决方案，也可以在SO

找到

http://jsfiddle.net/kaAjW/

以下是原始帖子的链接

How do I keep two divs that are side by side the same height?

这种技术被称为Faux Columns，这里有一篇关于它的文章

http://www.alistapart.com/articles/fauxcolumns/

Answer 2

我使用display = table-row，table和table-cell解决了这个问题。我添加了一个div作为表格。现在它很完美！看一看。

http://jsfiddle.net/tcWCC/47/

Answer 3

如果你正在尝试做的是将内容放在带有圆形conrners的灰色框中，那么你的div不需要具有相同的高度。只需将background-color和border-radius移动到封闭的div：http://jsfiddle.net/tcWCC/41/

Answer 4

我认为如果不使用html表，你将无法做到这一点。