11-11-2009, 02:07 AM
I'm probably opening up a can of worms here! But which is more favorable when creating css layouts, em or px? Or doesn't it really matter anymore?
I understand that px is more precise but em is made to be elastic on the users setting so that any interfaces used in the webpage won't break.
Frankly the math is hell using em! px is much easier.
I'd like to know what the more experienced community thinks!
I appreciate your input!
11-11-2009, 02:10 AM
Here's one view - http://www.astahost.com/Sizes-Webdesign-Em-Vs-Px-t8926.html
11-11-2009, 02:45 AM
I'd like to know what the more experienced community thinks!Using ems is much more kind to the user since they can increase the text size without zooming the entire layout. I force the font size of all Web sites to 18 using a Firefox setting so that I don't have to strain to read them at a distance (of about 1.5 feet) and many sites break because they were designed using pixels.
Unfortunately, I often encounter poorly designed Web sites that are broken by this and have to resort to a Firefox extension so that I can quickly toggle the "Minimum font size" on and off. Then I have to strain to read again.
For some examples: I often see text disappearing beyond the boundary of an overflow: hidden element or overlapping other text (e.g., Facebook). Sometimes white text will escape a box with a dark background onto the white background outside of it and I can't read it (e.g., The Huffington Post). Other times people create custom, pixel- and image-based boxes that look broken when the box size expands (e.g., Dream.In.Code); this is probably the hardest issue to address since CSS and vector graphics support in browsers hasn't caught up yet. Finally, when people restrict their layout width using pixels, this also causes problems with a lot of text being squeezed into a small area horizontally as the text expands vertically when it otherwise could have used up more horizontal screen real estate (e.g., (NarutoFan) Naruto Forums).