title: JSF2 add custom font to css stylesheet
body: <p>i want to use external font <a href="http://www.justbenicestudio.com/studio/websymbols/" rel="noreferrer">WebSymbols</a></p>
  
  <p>and i placed it my stylesheet.css declaration</p>
  
  <pre><code>@font-face{ 
  font-family: 'WebSymbolsRegular';
  src: url('websymbols-regular-webfont.eot');
  src: url('websymbols-regular-webfont.eot?#iefix') format('embedded-opentype'),
       url('websymbols-regular-webfont.woff') format('woff'),
       url('websymbols-regular-webfont.ttf') format('truetype'),
       url('websymbols-regular-webfont.svg#WebSymbolsRegular') format('svg');
  }
  
  .fakeImage {
  font-family: 'WebSymbolsRegular';
  font-size: 12px;
  text-decoration: none;
   }
  </code></pre>
  
  <p>My stylesheet.css located in META-INF/resources/css/stylesheet.css file. I put font files  (eot, svg, etc.) in the same directory - META-INF/resources/css. In header of my jsf page i put reference to this stylesheet:</p>
  
  <pre><code>&lt;h:outputStylesheet library="css" name="stylesheet.css" /&gt;
  </code></pre>
  
  <p>But instead of special symbols from font i got regular text. All other css styles are worked normally. Any idea how to use custom font?</p>