/    Sign up×
Community /Pin to ProfileBookmark

elastic web design (ems)….

hello everyone,

would it be recommended by the advanced designers on this site to just learn elastic web design (em) from the very beginning? instead of having to go back and change all your stylesheets at a later date….

to post a comment
CSS

11 Comments(s)

Copy linkTweet thisAlerts:
@tracknutSep 07.2009 — Hmmm.... there are some assumptions in your question:

  • 1. "elastic web design = ems" - one can, and quite possibly should, use ems for text sizing regardless of whether a web page is elastic or not.

  • 2. "elastic web design is somehow better or more advanced than fixed designs" - I don't think you can generalize like that. There will be instances where an elastic design is better, and instances where it is worse. To avoid "having to go back and change all your stylesheets" I'd say pick the right model for the particular site to start with, if that's possible.


  • Dave
    Copy linkTweet thisAlerts:
    @cfajohnsonSep 08.2009 — 
    would it be recommended by the advanced designers on this site to just learn elastic web design (em) from the very beginning?[/QUOTE]

    [indent]

    Definitely!

    Unless there is a very good reason for using a fixed-width design, don't do it. It creates more problems than it solves (if it solves any).

    People who use fixed-width designs are still thinking of desiging on paper instead of the flexible medium that is the web.

    Note that for column widths, percentages usually work better than ems

    (but use ems for max-width or min-width).

    [/indent]
    Copy linkTweet thisAlerts:
    @friggadierauthorSep 11.2009 — Sitepoint book I am re-reading says elastic design is where EVERYTHING is in ems so I guess I'll just have to figure it out by trial and error.

    I just want to do things the right way since I am actually taking this seriously this time around.
    Copy linkTweet thisAlerts:
    @friggadierauthorSep 11.2009 — i feel obliged to share Patrick Griffith’s article on elastic design:

    http://www.alistapart.com/articles/elastic/
    Copy linkTweet thisAlerts:
    @cfajohnsonSep 11.2009 — [indent]

    It's ironic that alistapart.com's own pages are not fluid, or even elastic.

    [/indent]
    Copy linkTweet thisAlerts:
    @friggadierauthorSep 12.2009 — lol.. i didnt even check..

    such tragic irony.. way to check though....
    Copy linkTweet thisAlerts:
    @friggadierauthorSep 12.2009 — but what about the article????
    Copy linkTweet thisAlerts:
    @friggadierauthorSep 12.2009 — maybe Patrick just contributed article..

    and stylesheet was created by someone else a long time ago.. but funny comment =)....
    Copy linkTweet thisAlerts:
    @opifexSep 18.2009 — From experience (read: lot's of failures that have shown the way NOT to do things), "elastic" designs should probably be percentage based. While % is not read correctly in IE, you can make adjustments.... ems are read haphazardly at best.

    A good point to remember is that printers use the "em" for a measurement when the layout is on a piece of paper that has static dimensions....
    Copy linkTweet thisAlerts:
    @cfajohnsonSep 19.2009 — From experience (read: lot's of failures that have shown the way NOT to do things), "elastic" designs should probably be percentage based. While % is not read correctly in IE, you can make adjustments....
    [/QUOTE]

    [indent]

    I've never heard that; can you point to an example?

    [/indent]

    ems are read haphazardly at best.
    [/QUOTE]

    [indent]

    In IE, ems are fine if you use: body {font-size: 100%;}; ems will then be relative to the current font size.

    [/indent]

    A good point to remember is that printers use the "em" for a measurement when the layout is on a piece of paper that has static dimensions....[/QUOTE]

    [indent]

    Their use in CSS is different. 1em is the height of the current font.

    [/indent]
    Copy linkTweet thisAlerts:
    @opifexSep 20.2009 — lots of examples right here in this forum... just search for them.

    em has been well discussed also.
    ×

    Success!

    Help @friggadier spread the word by sharing this article on Twitter...

    Tweet This
    Sign in
    Forgot password?
    Sign in with TwitchSign in with GithubCreate Account
    about: ({
    version: 0.1.9 BETA 6.17,
    whats_new: community page,
    up_next: more Davinci•003 tasks,
    coming_soon: events calendar,
    social: @webDeveloperHQ
    });

    legal: ({
    terms: of use,
    privacy: policy
    });
    changelog: (
    version: 0.1.9,
    notes: added community page

    version: 0.1.8,
    notes: added Davinci•003

    version: 0.1.7,
    notes: upvote answers to bounties

    version: 0.1.6,
    notes: article editor refresh
    )...
    recent_tips: (
    tipper: @nearjob,
    tipped: article
    amount: 1000 SATS,

    tipper: @meenaratha,
    tipped: article
    amount: 1000 SATS,

    tipper: @meenaratha,
    tipped: article
    amount: 1000 SATS,
    )...