1

我有一个应用程序,其中我的布局是动态的。它可以像一张桌子(1X1、2X2 或 3X3)。在 Firefox 和 Chrome 中,我的 div ViewPortContent 以正确的方式调整大小。但在 IE 中什么也没有发生。ViewPortContent 没有调整大小,以便像 Firefox 或 Chrome 一样填充剩余的内容。100% 高度属性不能正常工作?你能帮我吗?

下面是我的 JsFiddle(在 IE 和 Mozilla 中尝试)

.dhDivTable{
height:500px;
width:100%;
background:black;
display: table;
table-layout:fixed;
}
.dhDivRow {
display: table-row;
}
.dhViewPortWrapper {
display: table-cell;
padding: 3px;  }

.dhViewPortContent{
 border: solid 1px violet;
 height:100%;
 width:100%;
 display: table;
 position:relative;
 color:white;
}

http://jsfiddle.net/qqTtQ/1/

4

1 回答 1

1

Palash 在一般情况下是正确的,但您的情况稍微复杂一些。您需要在.dhViewPortWrapper类中添加一个高度指令才能导出高度,但您设置的高度必须是分配给当前行的表格高度的比例。您将需要动态分配它。因此,如果您知道将有两行,您可以将dhViewPortWrapperdiv 定义为:

<div class="dhViewPortWrapper" style="height: 50%;">

如果您需要行具有动态高度,则需要弄清楚如何计算高度并应用它们。

于 2012-12-27T14:47:11.800 回答