Question on skinning just 1 table component.

[danny chen <ya...@gmail.com>]

Hi All,

On my JSF page, I have multiple tables (<tr:table>).  For one of the table,
I want display it differently.  I am currently passing in a value for
styleClass.  My question is how can I apply the skin to just that table.  I
don't want borders for the table.  And I want the column header to display
with red background and bold txt.

<tr:table value="#{test.values}" var="value" horizontalGridVisible="false"
verticalGridVisible="false" styleClass="noBorderTable">
  <tr:column styleClass="columnTitle" headerNoWrap="true" align="center">
    <f:facet name="header">
      <tr:outputLabel value="header 1" />
    </f:facet>
    <tr:outputTextvalue="#{value.name} "/>
  </tr:column>
  <tr:column styleClass="columnTitle" headerNoWrap="true" align="center">
    <f:facet name="header">
      <tr:outputLabel value="header 2" />
    </f:facet>
    <tr:outputTextvalue="#{value.desc} "/>
  </tr:column>
<tr:table>

The following will change all of the table and column elements which is NOT
what I want.  I need something specific to "noBorderTable" and "columnTitle"

af|table::content {
    border: none;
}

af|column::header-text {
    border: none;
    background-color: red;
    white-space: nowrap;
    font-weight: bold;
}

Thanks,
Yao-Ning