CSS styling : Does it matter if you use px or em? Why do some people look down on using pixels?

Question

I am trying to become better as using CSS for webpage styling. When I go into forums I notice there are a lot of negative comments when people use pixels to define the size of things - I notice that many sits use "em" instead.

I do not understand the reason behind this. It is easy to set the size of things using pixels: font-size 12px, padding-top 20 px, etc.

So if that works why is the "em" standard of measurement more respected in certain cirlces? Is it simply a Mac vs. PC debate?

Answer 1

It is an issue of how your site looks in different environments

People say em's because it is a fluid technique in design. EM's allow the site to be resized with the text on the site.

Personally, I find both very useful. Anyone who says they only use one is inexperienced in web design, and is simply parroting a warning someone told them about their site not being able to change sizes.

Ultimately, you have to consider that if the page IS resized, you may end up with some anomalies on the page. You need to plan for this kind of thing, so the site doesn't look completely bonkers on a resize.

If you use pixels, your text could get scrunched up in a div that's size is limited.

So yeah...like I said, both are needed in the web design toolbox. Just as we still have manual screwdrivers in an age where everyone has an electric one.