使用divs水平和垂直填充所有可用空间

时间:2010-11-09 13:46:42

标签: html css layout

我正在尝试在没有表格或JavaScript的情况下实现以下布局。

The layout

它基本上是桌面软件的常见布局。一些工具栏和中间的实际内容。我正在尝试在Web应用程序中复制布局。

我需要所有工具栏都是灵活且可选的。因此,在一个州,可能只有顶部工具栏有3行图标,而在另一种情况下,所有四个工具栏只有一点点内容。

应用程序将使用文档宽度/高度的100%,并且不得溢出。但是,中间的div有溢出:auto并且应该在每个方向上缩放。可能存在隐藏所有工具栏然后中间div应该占用整个文档的情况。

该应用程序需要JavaScript,并且根本不支持IE6,但我仍然在寻找一种跨浏览器的方式来使用CSS。

使用表格来完成它非常简单和干净,我知道如何使用JavaScript,但我多次遇到此问题,并希望停止使用表格。

1 个答案:

答案 0 :(得分:4)

无法跨浏览器兼容。 使用jQuery javascript插件:http://layout.jquery-dev.net/