title: Css font-face using ttc file
body: <p>This is my first time using font-face, and it's really hard for me to actually render the exact font, especially when it comes to <code>*.ttc</code> files.</p>
  
  <p>Here is what I've done so far:</p>
  
  <pre><code>@font-face {
      font-family: 'FontName';
      src: url('../fonts/font.ttc') format('truetype');
      font-weight: normal;
  }
  
  
  .header {
      font-family: 'FontName;
  }
  </code></pre>
  
  <p>When I check the network tab in Chrome's inpector, I can see that the font is loaded successfully, but the result text still uses another font.</p>
  
  <p>What did I do wrong? Please help me to fix this problem. Thanks a lot in advance.</p>
  
  <p><strong>Update</strong></p>
  
  <p>One more thing that I figured out. When I style inline, the font is rendered correctly.</p>
  
  <pre><code>    &lt;p style="font-family:'FontName'"&gt;test 2&lt;/p&gt;
  </code></pre>
  
  <p>Is there any delay in loading or something like that?</p>