title: How do I change the font-family of a <button> element?
body: <p>This is my only CSS</p>
  
  <pre><code>@font-face {
    font-family: 'thefont';
    src: url('fonts/the-font.otf');
    font-style: normal;
  }
  
  body {
      font-family: 'thefont';
  }
  </code></pre>
  
  <p>When I do a <code>&lt;button&gt;Hi&lt;/button&gt;</code> the font ends up being <code>-apple-system</code>.</p>
  
  <p>If I actually assign the font to <code>button</code>, it will make the font appear.</p>
  
  <p>Does anyone know why it's not affecting the body and everything inside it?</p>