JSF: Is it possible to insert some css class into template from inherited jsf page

Question

Can I add some css class into template from inherited jsf page.

template.jsf:

    <h:head >
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <h:outputStylesheet library="css" name="template.css"  />
        <h:outputScript library="javax.faces" name="jsf.js"/>
        <h:outputScript library="js" name="jsf_2.2_ajax_fix.js"/>

        <title>
          <h:outputText value="TEMPLATE:  "/> 
          <ui:insert name="subtitle"/>
        </title>
        <ui:insert name="header"/>
      </h:head>

      <h:body  style="margin: 0px !important; padding: 0; background-color: white; height: 100%;"  >

        <ui:insert name="status" />

 <h:form id="mainForm" >
        <ui:insert name="content"></ui:insert>
      </h:form>

      </h:body>

inheritedPage.jsf:

<h:head>
    <h:outputStylesheet library="css" name="templateAlterEgo.css"  />
  </h:head>
  <h:body class="pageBody">
      <ui:define name="subtitle">
        <h:outputText value="STATE OF SYSTEM"/>
      </ui:define>
      <ui:define name="content">

     <!-- some content-->

      </ui:define>
</h:body>

How I can put templateAlterEgo.css into template.jsf from inheritedPage.jsf.

Answer 1

Change your inheritedPage.jsf with target='head'

<ui:define name="subtitle">
 <h:outputStylesheet library="css" name="templateAlterEgo.css" target="head" />
 <h:outputText value="STATE OF SYSTEM"/>
</ui:define>