Adding CSS file in ADF JSF page -

i have created jsf page

<f:view>   <af:document id="d1">    <f:facet name="metacontainer">    <af:resource type="css">      af|inputtext :: content      {      color:red;      } </af:resource>   </f:facet>    <af:form id="f1">   <af:panelheader text="customer" id="ph1">      <af:selectoneradio label="gender"                        requiredmessagedetail="must provide gender"                        id="sor1" layout="horizontal"                        value="#{customerbean.gender}" autosubmit="true">       <af:selectitem label="female" value="f" id="si1"/>       <af:selectitem label="male" value="m" id="si2"/>     </af:selectoneradio>   </af:panelheader>   <af:inputtext label="firstname" id="it1" value="#{customerbean.first}"/>   <af:inputtext label="lastname" id="it2" value="#{customerbean.last}"/>   <af:outputtext id="ot1"                  partialtriggers="sor1" value="#{customerbean.gender}"/> </af:form> 

i want apply red color inputtext using. can perform using css. not able output it. have tried

 <f:facet name="metacontainer">   <af:resource type="css">      .text-label      {      color:red;      }   </af:resource>   </f:facet> 

another way tried :

 <f:facet name="metacontainer">      <af:resource type="css">       [id=form\:inputtext]{        color: red;       }      </af:resource> 

it's not working. please suggest me proper way use css code in jsf page in adf.

you don't use css directly in adf faces page, because components use in adf faces generate multiple html elements. use skins. see video started. , this , this. reading docs new framework idea ;-)

you don't version you're on - info helps - recent versions have skin editor built jdeveloper or downloadable.

use skin selectors set style components , sub-components.

skin files generate correct css file when page gen'd , downloaded page.