troubleshooting Question

CSS em font size vs. px

Avatar of slightlyoff
slightlyoff asked on
4 Comments3 Solutions728 ViewsLast Modified:
I'm trying to clean up some bad habits (bad habits according to things i've read) concerning HTML coding with CSS.  One of the things I've always used to define my font size in my css was the "px."  However, I've been reading things that suggest that "em" is a better measurment tool due to screen resolution changes and all that.

So I'm editing in Dreamweaver and setting the font size for my navigation menu in CSS.  I've learned that the base font size for most browsers is 16px.  So if I want the font to appear roughly at 12px for most browsers, i would do "font-size:.85em;" or something like that.

The problem is, Dreamweaver (and FireFox) is displaying this font much smaller than I would like.  So I changed the font size to:  font-size:1.1em.  (this looks perfect and fits horizontally in my layout's navigation bar.  However, when i preview in Internet Explorer, the font is much bigger - which makes sense if the base font for I.E. is 16px...

So here I am trying to use em for my font measurment and I can't get the same look across 2 browsers for something as simple as the navigation.

Any ideas on how I can clear this up?  My goal is to have the navigation font size the equivalent of  around 12px - maybe slightly larger.  And I'd like to avoid using px if possible.

Any help would be greatly appreciated!

Our community of experts have been thoroughly vetted for their expertise and industry experience.

Join our community to see this answer!
Unlock 3 Answers and 4 Comments.
Start Free Trial
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 3 Answers and 4 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros