Menu
I'm a CSS newbie and was wondering if there is a benefit using em instead of px when it comes the cross browser compatibility of my CSS.
572
If you use px as the unit for fonts, the fonts will not resize whereas the fonts with rem / em unit will resize when you change the system's font size. So use px when you want the size to be fixed and use rem / em when you want the size to be adaptive/dynamic to the size of the system. Save this answer.
Cross-browser compatibility can be defined as the ability of a website, application or script to support various web browsers identically. This issue is important as now-a-days numerous web browsers are used for web surfing and all of them have different standards.
Strictly speaking the use of em over px isn't really a cross-browser compatibility issue - all browsers support the use of them both for font-sizing.
It used to be advisable to avoid using px for font sizing as the browser with the biggest market share, IE6, wouldn't allow text resizing. It sees px as an absolute value, not a relative value like em, and so wouldn't scale text up or down sized in px.
Depending on your audience you may not need to worry about it. There's some great info on the benefits of the em, and how they can help towards building a fluid layout here: http://www.alistapart.com/articles/fluidgrids/
62
Yes. Some browsers (-cough IE8 -cough)still do not scale text properly when it's in pixels. They zoom fine, but changing the text size gives no results.
Ems is more or less guaranteed to scale when the user requests it to. Also, ems can be used for navigation buttons or boxes that accommodate text that must scale well with the text- it's not just a font size. Try different variants in a bunch of browsers zooming in an out and enlarging text and see what results you get.
24
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
