对齐 panelGrid 列内的内容

Posted 2023-02-22

【中文标题】对齐 panelGrid 列内的内容

【英文标题】：Aligning content inside panelGrid columns

【发布时间】：2011-09-13 16:40:21

【问题描述】：

如何将 panelGrid 组件创建的列中的内容与top 对齐？

我试过没有成功，下面的代码

<h:panelGrid columns="2" style="vertical-align:top;  " >
       <p:tabView style="margin:0px 0px 50px 0px; width: 450px; padding-top: 0px;vertical-align:top" ></p:tabView>                
       <p:menubar autoSubmenuDisplay="true" style="width: 300px; vertical-align:top" ></p:menubar>
</h:panelGrid>

但由此创建的 2 列仍保持垂直居中对齐。

【参考方案1】：

对我来说，如果你这样做，它会起作用：

<h:panelGrid columns="6" cellspacing="4" cellpadding="4" styleClass="panelColumns">
</h:panelGrid>

并创建一个包含以下内容的 css 文件：

.panelColumns td 
    vertical-align: top; 
 

就像附加提示一样......所以你不必搜索很长:)

【参考方案2】：

根据this的回答，你可以这样做（我最喜欢这种方法）

<h:panelGrid columnClasses="className">

.className 
    vertical-align: top;

【讨论】：

每列都需要一个列类