title: JSF/Facelets : CSS file is not being recognized using <h:outputStylesheet> tag
body: <p>I'm working on a project using JSF/Facelets. I want to do some CSS changes on my View XHTML, but nothing happen when i deploy my web application in my Tomcat Server. I've tried many tricks but i've got the same result.</p>
  
  <p>Anyway, here's my "styles.css" : </p>
  
  <pre><code>body { width: 750px; }
  
  #header 
  {
  width:              100%;
  font-size:          36px;
  font-weight:        bold;
  line-height:        48px;
  background-color:   navy;
  color:              white;
  }
  
  #footer
  {
  width:              100%;
  font-weight:        bold;
  background-color:   navy;
  color:              white;
  }
  </code></pre>
  
  <p>And this is the main template "Template.html" including "Header.html" and "Footer.html", where i put my "styles.css" using the  tag :</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:f="http://java.sun.com/jsf/core"
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:ui="http://java.sun.com/jsf/facelets"&gt;
  &lt;head&gt;
  &lt;h:outputStylesheet name="css/styles.css" /&gt;
      &lt;!-- i've also tried this one, using the "library" attribute --&gt;
      &lt;!--
       &lt;h:outputStylesheet library="css" name="styles.css" /&gt;
      --&gt;
  &lt;/head&gt;
  &lt;h:body&gt;
  &lt;h:panelGroup id="page" layout="block"&gt;
  
      &lt;h:panelGroup id="header" layout="block"&gt;
          &lt;ui:insert name="header"&gt;
              &lt;ui:include src="Header.html" /&gt;
          &lt;/ui:insert&gt;
      &lt;/h:panelGroup&gt;
  
      &lt;h:panelGroup id="container" layout="block"&gt;
          &lt;h:panelGroup id="content" layout="block"&gt;
              &lt;ui:insert name="content"&gt;CONTENT&lt;/ui:insert&gt;
          &lt;/h:panelGroup&gt;
      &lt;/h:panelGroup&gt;
  
      &lt;h:panelGroup id="footer" layout="block"&gt;
          &lt;ui:insert name="footer"&gt;
              &lt;ui:include src="Footer.html" /&gt;
          &lt;/ui:insert&gt;
      &lt;/h:panelGroup&gt;
  
  &lt;/h:panelGroup&gt;
  
  &lt;/h:body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Anf finally here's my "Main.xhtml" which include the template "Template.html" :</p>
  
  <pre><code> &lt;?xml version="1.0" encoding="UTF-8"?&gt;
   &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
   &lt;ui:composition xmlns="http://www.w3.org/1999/xhtml"
  xmlns:f="http://java.sun.com/jsf/core"
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:ui="http://java.sun.com/jsf/facelets"
  xmlns:a4j="http://richfaces.org/a4j"
  xmlns:rich="http://richfaces.org/rich" template="Template.html"&gt;
  &lt;h:body&gt;
      &lt;ui:define name="content"&gt;
          &lt;h:form&gt;
              &lt;h:inputText title="inputText"&gt;&lt;/h:inputText&gt;
              &lt;h:commandButton value="OK"&gt;&lt;/h:commandButton&gt;
          &lt;/h:form&gt;
      &lt;/ui:define&gt;
  &lt;/h:body&gt;
   &lt;/ui:composition&gt;
  </code></pre>
  
  <p>Thanks in advance :)</p>