title: What fonts do browsers download when using @font-face
body: <p>@font-face is kind of confusing as all the browsers cannot decide on a single file format to use.  Below is what I am currently using to add 1 new font to a site, you can see there is 4 separate font files, I know that each one is because some browsers support different formats but does the browser download all the files or just the 1 that it needs?</p>
  
  <pre><code>@font-face {
      font-family: 'Oswald';
      src: url('oswald-webfont.eot');
      src: url('oswald-webfont.eot?#iefix') format('embedded-opentype'),
           url('oswald-webfont.woff') format('woff'),
           url('oswald-webfont.ttf') format('truetype'),
           url('oswald-webfont.svg#OswaldRegular') format('svg');
      font-weight: normal;
      font-style: normal;
  
  }
  </code></pre>