WordPress.org

1. swh
   Member
   Posted 6 years ago #

   I noticed that all themes that are based on the default theme's style.css display quite differently in IE (Internet Explorer) vs the Firefox browser.

   The big difference is the font size.

   In IE, all fonts look very big when the font size in the browser is set to "medium".

   In Firefox, however, the same settings in the style.css cause all the fonts to be extremely small, to a point that one has to manually adjust the "default" font size setting in the browser.

   What to see what I mean, check this blog out:

   http://davesdelights.com/blog/

   Note that, to elminate the need to manually adjust the font size in Firefox, I have increased the default font-size. But this change makes all fonts look pretty big in IE.

   This is very troublesome because I have to spend a few hours to play with the style.css file, just to make the font size relatively the same (or at least comfortable enough without needing a surfer to manually adjust the font size) whenever I install a new theme or blog!

   Interesting enough, with the following blog when I use the theme called "Impact", the fonts display exactly the same in both IE and Firebox browsers:

   http://selfwebhosting.com/update/

   So the author of the Impact theme must know the tricks to make this happen. What are these tricks?

   I wonder if you guys can incorporate those tricks in the default and classic themes when you release the next version of your script so that a newbie does not have to play with the style.css file ever.

   I noticed that the style.css for the Impact theme does not use the "em" to define the size of fonts (or anything eles) at all. It only uses the "px" to define the size. Is this one of the tricks?

2. Chris_K
   Member
   Posted 6 years ago #

   Note that, to elminate the need to manually adjust the font size in Firefox, I have increased the default font-size. But this change makes all fonts look pretty big in IE.

   Actually, in firefox 1.5 your fonts look huge!

3. irakrakow
   Member
   Posted 6 years ago #

   SWH,

   You're correct about the "em" vs. "px" trick. Font sizes in "em" units are relative to the font itself - historically, an "em" unit is the width of the letter M in the designated font. So when you change the font size, all the sizes specified in "em"s change relative to it.

   Font sizes in "px" are absolute sizes in pixels. These sizes will be the same no matter what the browser's font is. Here is an explanation of CSS font sizes.

   As far as changing themes, when to use px, em, or other font sizes is a design decision. If you don't like your theme, find another that's closer to your design requirements, and tweak the CSS from there.

4. kt101
   Member
   Posted 6 years ago #

   Does anyone know why the code for hiding pages or page titles works in Firefox but not Internet Explorer? Cause it would be great if I could get it to work for both.

Topic Closed

This topic has been closed to new replies.