/    Sign up×
Community /Pin to ProfileBookmark

em vs px debate

Copy linkTweet thisAlerts:
Jan 29.2009

so i got in a large debate with a fellow UI-developer today, over *gasp* em/px for fonts. pay special notice that this was a “font measurement only” debate, not positioning/padding. his stance to what measurement to use is that “it doesn’t matter”. after a while, he had me sipping his kool-aid. his argument was basically that you can simply declare the font size at say 10px for the body, and just go around using the em off of that measurement, where 1em = 10px, 1.2em = 12px, etc.

now i understand that children elements will be relative to the parent. so using the 10px = body standard, a 1.2em = 12px, whereas an inheriting div within that will render 1.2em as something like 14-15px.

also, i know the old IE/Win argument that text-resize won’t change the size of px, but will change ems. however, now that newer browsers offer page zooming, it becomes almost a non-issue.

so i guess that leaves me at, “does it, in fact, matter?” outside of the inheritance and IE/win debates, what other arguments really are there for em over px in newer browsers and standards? or does it truly not matter?

to post a comment
CSS

4 Comments(s) ↴

Copy linkTweet thisAlerts:
@scragarJan 29.2009 — The way I see it ems are the users decision, px are a developer's decision. Where possible put the choice on the user, if you don't then someone will get annoyed at you for it.
Copy linkTweet thisAlerts:
@followthehollowJan 29.2009 — http://cssbeauty.com/skillshare/discussion/310/em-vs-px-and-why/

It does matter somewhat, but the arguments will be there regardless. As I understand it, pixels are a set size, and work best with designs that assume fixed dimensions for the text in question. Quite simply, if you don't want the size to change dynamically, use px, as it is straightforward and is easy to adjust and understand.

Ems are a relative width defined by certain parent-child relationships regarding the DIVs themselves. I read that they were for those who aimed for a more dynamic site who's text would adjust accordingly with the DIVs albeit some issues may arise with how different browsers may handle this differently.

I would not, however, take this information as exact. Through all I've read about ems, I have yet to see a page adjust text size based upon the relativity of the containing DIV. This is probably just my inexperience, but for most web sites, I think pixels are probably what you'll want to use.
Copy linkTweet thisAlerts:
@unigogoJan 29.2009 — Em can be used to define the size of font and measure size of layout. If em is used for layout, it's relative to the size of font defined in its father node (normally body tag). No matter which unit for the font. You can visual test in some of my layout generators.

For me, I do not prefer to using em because it's a big unit and complex. Px is more precise and font indepandent. The outcome is the same, just generating a fixed column layout.
×

Success!

Help @superjoepsu 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 5.5,
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: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

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