设置 p:tab 的高度

Question

如何为pf元素设置"动态"高度？

我的问题：我有一个高度为 80vh 的div 标签。在那个div标签中，我有一个TabView ->Tab->树。 为了使树具有与TabView相同的高度，这是我的代码：

<div id="content" style="height: 80vh">
<p:tabView id="tabView" style="height: 100%">
<p:tab id="tab" title="Menu">
<p:tree id="tree" value="#{treeBean.rootTreeNode}" var="node" dynamic="true"
styleClass="treeClass">
<p:treeNode>
<h:outputText value="#{node}"/>
</p:treeNode>
</p:tree>
</p:tab>
code for second tab...
</p:tab>
</p:tabView>
</div>

如果弄清楚，stlye = "height: 100%"仅引用父元素的高度。但是我无法设置<p:tab>的高度.现在我将值设置为固定的 px 值，以便它适合我。但在其他屏幕上则不然。

Answer 1

请参阅 TabView 的外观文档： https://primefaces.github.io/primefaces/8_0/#/components/tabview?id=skinning

然后也许尝试为选项卡面板设置 CSS

.ui-tabs-panel {
height: 100%;
}