SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    Founder of Primal Skill Ltd. feketegy's Avatar
    Join Date
    Aug 2006
    Posts
    482
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Confused about measurement units

    Hello,
    I can't figure out something. I read 1-2 articles on how it's beneficial using em units over pixel units

    What I don't know exactly is it's enough to use em units only with elements involving text? (h1,h2,..,font-size,etc)

    Or should I use em unit with every element? div, span, etc...

    I want my site to be more accessible for screen readers, etc.

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,496
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    Using ems will have nothing to do with how screen readers see your site as that is a totally different issue.

    The main reason for using ems is to allow a page to scale uniformly which means that using it for the text and also for the containers in order to allow things to grow together when text is resized.

    Here is an example:

    http://www.pmob.co.uk/temp/emdemo.htm

    Another reason for using ems instead of pixels for text is that in IE6 and under you cannot resize pixel based test via the browser controls. You can use relative sizes for the fonts and pixel sizes for the containers but be aware that the design won't scale uniformly. However, if the site is otherwise well designed it may not be an issue and many people do it this way.

    Designing a whole site in ems is more complicated and time consuming than using pixels as there are certain issues to overcome. It all depends on the job in hand and how you want your page to look when resized. If using pixels for the layout (ems for text) then as long as the page is still readable after a few text resizes then that's ok as it will never be perfect anyway.

    When using ems for the layout then the whole page scales together and still looks the same more or less.

    Hope that's of some use.

  3. #3
    SitePoint Guru Chroniclemaster1's Avatar
    Join Date
    Jun 2007
    Location
    San Diego, CA
    Posts
    784
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I use ems too and for the same reasons that Paul outlined above. From a usage point of view there are a couple of exceptions. To set the base size of my website text, I use the t-shirt sizes, usually medium. I'm pretty sure you can then use ems indiscriminately, but I've always been nervous sizing text based on a unit that depends on a the size of a text character. That sounds awfully circular to me so I use percentages to handle font-sizes for heading, etc. That keeps everything relative to the base font size. Then all my divs, margins, indents, everything I do in ems. It's identical to doing it in pixels, just with a different unit of length. A unit that scales well and keeps your page elements in the same ratio. It's an effect that seems to hold a layout together, the way you designed it, better than any other technique that I've worked with.
    Whatever you can do or dream you can, begin it.
    Boldness has genius, power and magic in it. Begin it now.

    Chroniclemaster1, Founder of Earth Chronicle
    A Growing History of our Planet, by our Planet, for our Planet.


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
  •