title: Why font-size in body does not affect font in a table unless I add 1em?
body: <pre><code>&lt;style&gt;
  body {
      font-size: 14px;
  }
  &lt;/style&gt;
  
  &lt;body&gt;
  Text outside table.
  &lt;table&gt;
      &lt;tr&gt;&lt;td&gt;Text inside table.&lt;/td&gt;&lt;/tr&gt;
      &lt;tr&gt;&lt;td&gt;Text inside table.&lt;/td&gt;&lt;/tr&gt;
      &lt;tr&gt;&lt;td&gt;Text inside table.&lt;/td&gt;&lt;/tr&gt;
  &lt;/table&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>I'm trying to specify base font size for my website so in other places I can use percentage or em to specify the size.</p>
  
  <p>The html code above, without <code>body</code> style the font will be at the same size. However, why with <code>font-size</code> in <code>body</code> style like above, only "Text outside table." got affected by the size change? Isn't everything is encapsulated in <code>&lt;body&gt;</code> ?</p>
  
  <p>I need to add </p>
  
  <pre><code>table {
      font-size: 1em;
  }
  </code></pre>
  
  <p>In order to make font in my table follow <code>body</code>'s font-size. Why this is not the case as with my other <code>&lt;div&gt;</code>s in my page? Those <code>&lt;div&gt;</code>s did follow <code>body</code>'s <code>font-size</code> nicely.</p>