在Primefaces panelGrid中设置行的高度

Question

我试图使用PrimeFaces实现一个页面来实现这个目标。

我有这段代码。

<p:panelGrid style="width: 100%; height: 100%" >                
    <p:row id="first-row">
        <p:column>
            <div id="top">
                <ui:include src="..." />
            </div>
        </p:column>
    </p:row>    
    <p:row id="second-row">
        <p:column>
            <div id="bottom">
                <ui:include src="..." />
            </div>
        </p:column>             
    </p:row>                
</p:panelGrid>

和CSS是

tr#first-row {
    height: 60%;
}

tr#second-row {
    height: 40%;
}

我不想将高度设置为<td>或<div> inside <td>，因为我喜欢使用百分比来灵活调整， 100％高度表的第一行60％和第二行40％。

问题是表格没有占用浏览器的完整可用空间。 目前，该表是空的，因此它甚至不占用浏览器的一半。

IE查看源代码如下所示：

我该如何解决这个问题？谢谢你宝贵的时间。