Home/ Questions/Q 3226292
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-17T16:26:20+00:00

I was reading now about how it’s a good practice to set the font

  • 0

I was reading now about how it’s a good practice to set the font on <body> to 62.5%, so that later you can use the divide-by-10 conversion from pixel units.

But I was wondering: why not set <body> to 6.25%? Then you can use the same dimensions for em units as for pixel units, assuming the default browser font size is 16 pixels.

E.g.

body {
    font-size: 6.25%; /* 1px */
}

p {
    font-size: 12em; /* 12px */
}
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Two issues.

    1. I seem to remember that if you set your initial font size quite small using a relative unit like ems, if the user resizes the text Internet Explorer, the font size will change quite a lot between the settings.

      It’s an odd phenomenon, and I’m not sure if it still occurs in IE, nor if you’re worried about users in IE who change the font size.

    2. You’re potentially condemning yourself to re-setting the font size every time you nest elements.

      An answer I wrote to another question tries its best to explain this, but in short, if you’re doing your font sizes in ems, you’re better off using font-size as little as possible, rather than making it ever-so-slightly easier to use font-size when you do.

      For example: say you want all <li>s on the site to use a font size of 12 pixels.

      li {
    font-size: 12em;/* 12px */
}

      If you then use the following HTML:

      <ul>
    <li>
        <ul>
            <li>
            ...

      Then you need to do this:

      li li {
    font-size: .083em;/* 12px */
}

      Otherwise the inner <li>s will be 12 pixels * 12 pixels = 144 pixels!

      Ems aren’t pixels. Ems refer to a percentage of the nearest ancestor’s font size, whereas pixels refer to actual pixels. In my opinion, trying to turn ems into pixels is more confusing than the alternative. You’re better off setting <body> to the most commonly used font size on the site, only changing from that when you need to, and putting the intended size in pixels in a comment after your em-based declaration. (That way, it’s easier to tell later if you’ve got something wrong.)

      (Of course, the only reason we avoid pixels is because IE doesn’t change the size of text sized in pixels when the user changes the font size in the browser. If you’re not worried about that, then just use pixels.)

    • 0