HTML: Font size is too big - why?

html font-size

10,307

<font size="14" face="sans-serif">

Whoah! Font tags. Not seen those in a long time!

The font size HTML attribute is not an absolute font size set in pixels or points(*), it is a scale of sizes ‘1–7’ relative to the default font size which you get with ‘4’. Setting a larger size than 7 is invalid, but typically gives you the same extra-large size as ‘7’. This happens for me in all browsers, not just Firefox.

There is pretty much no reason to use the font tag today. There's nothing about XSLT that prevents you from using CSS as well, either inline like a font tag:

<th style="font-size: 90%; font-family: sans-serif;">Group</th>

or, much more readably, in a stylesheet:

table { background: yellow; }
th, td  { font-size: 90%; font-family: sans-serif; }

(*: aside: never use points — the CSS pt unit — for anything but print stylesheets. On-screen it has all the disadvantages of absolute pixels plus the size comes out extra-wrong on some platforms. Use px for fixed font sizes and em or % for normal text.)

10,307

Author by

sivabudh

First, I'm a dreamer who engineers and innovates. Second, I CEO at CODIUM and 1000C startups.

Updated on June 04, 2022

Comments

sivabudh almost 2 years

Here's a snippet of my HTML code. I specify the font size for each text to be 14, but when I render it on Firefox, it looks so big! Is there a better way to specify the font size?

Note: I want to know how to do this in HTML, not using CSS.

<html>
  <head>
    <title>Clinics with H1N1 Flu Vaccine in Stock</title>
  </head>
  <body>
    <!-- BEG: Patient Group table -->
    <table border="2" bgcolor="yellow">
      <tbody>   
        <tr>
          <th><font size="14" face="sans-serif">Group</font></th>
          <th><font size="14" face="sans-serif">Vaccine Quota</font></th>
        </tr>
      </tbody>
    </table>
  </body>
</html>