SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    Get my greedy down dotJoon's Avatar
    Join Date
    Apr 2003
    Location
    daejeon, South Korea
    Posts
    2,223
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    what does em mean?

    Code:
    p{padding-bottom:10em}
    What does em mean in the code above?

  2. #2
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,478
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It means "emphemeral unit" which is relative to the current font size.

    For example, if the current font size was set to 16px, then the bottom padding would be set to 160px.

  3. #3
    SitePoint Member
    Join Date
    Sep 2007
    Location
    South China
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    What Dan says is 100% correct, but a liitle background info about em's

    Quote from "The Principles of Beautiful Web Design"

    "An em is a CSS unit that measures the size of a font, from the top of a font’s cap height to
    the bottom of its lowest descender. Originally, the em was equal to the width of the capital
    letter M, which is where its name originated."

  4. #4
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This is an old typographic unit, known as an 'em square' or 'mutton'. An em square was a square blank type, where the length of each side was the same as the width of an uppercase 'M' – normally the widest glyph in a given font.

    It is often used in typography to specify the width of blanks and of different types of dashes. You'll often see references like 'an M/3 space', which means a blank space that is one-third of an em wide.

    In CSS, one em is defined as the current font size, however that is defined. For most elements it's the inherited (computed) value from its parent element. The root element is special, since it doesn't inherit from anything. 1em for the root element is the default font size specified in the browser preferences (16px in most contemporary Windows browsers).

    Code CSS:
    body {font-size:16px}
    p {font-size:0.75em}
    With CSS like the example above, the text size in a paragraph will be 0.75×16px, or 12px.
    Birnam wood is come to Dunsinane


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •