Can someone please explain 'em' to me?

Discussion in 'HTML' started by delerious@no.spam.com, Dec 4, 2003.

  1. Guest

    I am finding this 'em' thing to be really confusing. It is supposed to be the
    'font size' of the relevant font. So 1em is supposed to be the same size as
    the relevant font. Which size though? The font's height or width? And
    different letters will have different heights and widths, so which height or
    width does the browser choose?
    , Dec 4, 2003
    #1
    1. Advertising

  2. brucie Guest

    in post <news:>
    said:

    > I am finding this 'em' thing to be really confusing.


    i think you're supposed to. i'm sure it says that in the specs
    somewhere.

    The amazing em unit and other best practices
    http://www.w3.org/WAI/GL/css2em.htm

    --
    brucie
    04/December/2003 03:59:15 pm kilo
    brucie, Dec 4, 2003
    #2
    1. Advertising

  3. Wipkip Guest

    wrote:
    > I am finding this 'em' thing to be really confusing. It is supposed
    > to be the 'font size' of the relevant font. So 1em is supposed to be
    > the same size as the relevant font. Which size though? The font's
    > height or width? And different letters will have different heights
    > and widths, so which height or width does the browser choose?


    http://tinyurl.com/xo46

    --
    Duende
    Wipkip, Dec 4, 2003
    #3
  4. delerious wrote:

    > I am finding this 'em' thing to be really confusing. It is supposed to be the
    > 'font size' of the relevant font. So 1em is supposed to be the same size as
    > the relevant font. Which size though? The font's height or width?


    Depending on who you believe, it is the height of the font (from the top
    of the 't' to the bottom of the 'g', or the width of a capital 'M'. The
    CSS 2 specs say the former, but traditional typography says the latter.
    Doesn't really matter as they're usually about the same.

    If you set 'font-size:1em' on the page's root element (depending on how
    you work, this may be the <html/> element, or *effectively* the <body/>
    element) then it means 'the same size as the visitor chose'.

    If you set 'font-size:1em' on other elements (paragraphs, headings, divs,
    table cells, etc) then it means 'the same size as my parent element'. For
    example:

    <div style="font-size: 8px;">
    <div style="font-size: 1em;">
    This font won't be in the visitor's default size. It will be 8px.
    </div>
    </div>

    --
    Toby A Inkster BSc (Hons) ARCS
    Contact Me - http://www.goddamn.co.uk/tobyink/?page=132
    Toby A Inkster, Dec 4, 2003
    #4
  5. wrote:

    > I am finding this 'em' thing to be really confusing.


    Try and find a good book on CSS. Usenet isn't really a surrogate for
    reading tutorials - it mostly just confuses you more unless you have
    good background information. People will just make guesses, most of the
    times.

    > It is
    > supposed to be the 'font size' of the relevant font.


    As a CSS concept, which is surely what you mean here (there is no such
    concept in HTML), it is _defined_ to be exactly that and nothing else.

    > So 1em is
    > supposed to be the same size as the relevant font.


    Well, yes, it _is_, by definition.

    > Which size though?


    The size of the relevant font. :)

    > The font's height or width?


    You would not go very wrong in thinking that it is the height. It
    definitely isn't the width of a font, if there _is_ such a thing (most
    fonts are not monospace, i.e. the widths of characters vary), and it
    isn't the width of any particular character except by coincidence.

    > And different letters will
    > have different heights and widths, so which height or width does
    > the browser choose?


    The size of the font. :)

    Whether we say that the size of a font is the height of the font is a
    matter of words. In any case, ultimately the size of a font is a design
    concept: it defines the height of the space inside which glyphs are
    designed, so that it contains all the descenders and ascenders, but in
    fact the glyphs may slightly extend beyond the limits of that space,
    especially if there are multiple diacritic marks.

    Consequently, the font size is virtually always larger than the height
    of any particular character. For example, the letter "A" has no
    descender, and its top normally does not touch the invisible line that
    delineates the font size, since there must be some room for eventual
    diacritics like an accent above it. (It's possible to design a font
    where characters with a diacritic mark have the base letter smaller
    than otherwise, but that's not common and not very esthetic.)

    --
    Yucca, http://www.cs.tut.fi/~jkorpela/
    Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html
    Jukka K. Korpela, Dec 4, 2003
    #5
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. suzy
    Replies:
    3
    Views:
    439
  2. BluDog

    Can Someone Please Explain...

    BluDog, Oct 4, 2004, in forum: ASP .Net
    Replies:
    4
    Views:
    470
    BluDog
    Oct 5, 2004
  3. Mike Henley

    can someone explain this to me please

    Mike Henley, Sep 6, 2003, in forum: Java
    Replies:
    6
    Views:
    369
    Mike Henley
    Sep 7, 2003
  4. harry
    Replies:
    12
    Views:
    732
    Blinky the Shark
    May 26, 2005
  5. Replies:
    5
    Views:
    320
    dorayme
    Oct 13, 2006
Loading...

Share This Page