title: CSS Font size not rendered by browser
body: <p>I have a php-script that creates a website dynamically from a database. For better readability I want to use two different font sizes, larger for the name, smaller for the date. I read a lot and finally added the &quot;span id&quot; in the output. <br></p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>#Klein {
    font-size: 1em;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class='Liste'&gt;&lt;a class='linkz3' href='index_dev.php?gekauft=49'&gt;TK-Pommes&amp;nbsp;&lt;span id="Klein"&gt; 2020-12-22&lt;/span&gt;&lt;/a&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>When I watch the page in the Firefox inspector, the small font from the CSS is recognized by the browser for the date string within the span tag, but there is no difference in the font size <a href="https://i.stack.imgur.com/Ntk59.png" rel="nofollow noreferrer">see attached screenshot</a> <br></p>
  <p>Since Firefox Linux, Firefox Android and Chrome Android all behave the same, I must have made a mistake. But which?</p>