jsf - 将图标添加到 p :panel?

Question

如何向组件 p:panel 添加图标？

<p:panel header="text" />

不幸的是，它不支持“图标”属性。所以我尝试了这个:

<f:facet name="header">
 <h:outputText value="text">
</h:outputText>
 <p:commandLink styleClass="ui-icon ui-icon-comment" />
</f:facet>

但这会在文本和命令链接之间添加一个换行符，它只显示为一个图标。

有人知道我还能怎么做吗？太棒了

Answer 1

图标导致其下方的文本向下移动的原因是因为 ui-icon 类具有 display: block 样式导致图像贪婪消耗行并将文本向下推。以下标题方面将围绕图像和文本构建一个 2 列的表格，强制标题并排显示它们。

<f:facet name="header">
  <h:panelGrid columns="2">
    <span class="ui-icon ui-icon-comment" />
    <h:outputText value="text" />
  </h:panelGrid>
</f:facet>