JSF + CSS：自定義面板組ID由UINamingContainer覆蓋

Question

我有用CSS設計的html頁面。有對DIV選擇和SPAN元素是這樣的：

 
... 

#gr-bg1 { 
    .... 
    background-color: red; 
    .... 
} 

... 

與panelGroups創造適當的它XHTML頁面：

<h:panelGroup id="gr-bg1" styleClass="item1" layout="block"> 
     <h:panelGroup styleClass="item-value"> 
      <h:outputText value="#{i18n.rejections}"/> 
     </h:panelGroup> 
     <h:panelGroup styleClass="num" layout="block"> 
      <h:outputText value="#{info.rejections}"/> 
     </h:panelGroup> 
</h:panelGroup> 

和結果具有HTML：

<div id="A4405:gr-bg1" class="item1"> 
    <span class="item-value">text</span> 
    <div class="num">34534535</div> 
</div> 

什麼如果css選擇器正在尋找＃gr-bg1 id？

Answer 1

幾個月前，我有與JSF和CSS相同的問題。我想我解決了它通過Firebug讀出了html生成的tag的Id，並替換了CSS-sheet的Id。

你的情況：

#A4405:gr-bg1 { 
.... 
background-color: red; 
.... } 

不知道這是否是最好的做法，但它是一種解決方法的。

否則，你可能會阻止JSF生成自己的ID，如元素的「A4405」，由上面給出你自己的ID的元素，並使用此而不是被放置在您的div的上一級。