两列相同的高度嵌套在另外两列相同的高度

Question

我正在开发一个MVC应用程序，并且在我们拥有的部分内容方面遇到了HTML / CSS布局方面的问题。

应用程序的shell包含两列，这两列扩展为具有最多内容的列的高度。左列包含应用程序的导航。右栏是内容区域。

我设法使这部分工作正常。

我遇到的问题是，对于某些页面，内容区域（右列）需要拆分为两列。我需要这两列来决定内容区域的高度，这反过来会决定主导航的高度。

任何输入都会非常有用！谢谢！

编辑我得到了它的工作，但我对解决方案并不完全满意。它需要我使用内联块，它读取空白区域。结果我在两行策略中使用了评论，但我担心在事后编辑/清理项目时会被某人删除。

http://jsfiddle.net/StSmith/RzKJX/

.

Answer 1

我想，如果您只是添加了列，它们会自动填充空间，因此决定了“内容”的高度。

但是，如果您浮动列，则包含元素将不会拾取它们的高度。在这种情况下，您需要添加列下方的已清除元素，或者更好地添加'clearfix'。