font size between FF and IE

[pianodevil]

i've got a paragraph of writing and it is much smaller in FF than it is in IE, and it is stuffing up my layout.

eg.:

<div style="position:relative; top:20px; left:20px; z-index:2; font-size:15px; font:Times New Roman, Times, serif; color:#6699CC; width:399px; height: 166px;">The things that are written here are stupid, and in fact, it is so stupid that even i can write something better than this. Although this is nont true, some things are true. For instance, the truness of that passage written by him had overwhelmed many humans, plants and animals. The plants and animals loved it sooooo much that they wrote their own. They made a lot of money from it and decided to sell it. After many unseccessful attempts, they tried to steal it, but consideriing it was their own, they had lost a part of themselves for good. As good turns bad, i finish writing a paragraph of nonsense.</div>

if you try it on FF and IE, it is much larger on IE

[drhowarddrfine]

I see no difference between the two.

[gsyi]

Perhaps itīs only a problem of your output device...

[encyclo]

Usually when you use pixel values for font size it will be consistent cross-browser. The only thing I can see which is not quite right is this:

<div style="position:relative; top:20px; left:20px; z-index:2; font-size:15px; [b]font:Times New Roman,[/b] Times, serif; color:#6699CC; width:399px; height: 166px;">

You should be specifying

font-family

instead - Firefox won't recognize it otherwise. You should also place font names with multiple words within quote tags (use single quotes as you are within a double-quoted block):

<div style="position:relative; top:20px; left:20px; z-index:2; font-size:15px; [b]font-family:'Times New Roman',[/b] Times, serif; color:#6699CC; width:399px; height: 166px;">

See if that helps. :)

[jrivesj]

Hey there - I'm new here and am having the same problems (font-sizes looking smaller in FF than in IE). All the CSS books tell me I should use "em" values for font sizes in my style sheet. Are you saying I should use absolute pixel values?

Appreciate any help you can give me - coding for FF is frustrating me no end.

THANKS

Jim

[tedster]

Em values will "adjust" their size according to the user preferences that are selected in the browser. If you can design a layout that accomodates such variation from user to user, many usability authorities consider this the best practice.

At the same time, many big commercial sites use a fixed "px" value so as not to break their layout. My own preference is to use a reasonably large px value and assume that people with a serious vision challenge will override my CSS with a customized user stylesheet.

[MatthewHSE]

Have you checked to make sure that both browsers are set to display text at the default size? That could be the problem.

On the em font sizes, I'm with tedster. I figure the average IE user won't know they can change font sizes anyway, whereas Firefox can resize any text regardless of the size unit used. So I go with px values and count on that being good enough. It was just too complex to get em's to work right down through the cascade.

[jrivesj]

IE set to "medium", FF to "normal"

I'll have to re-style everything, but if it will help, that's fine. THANKS for the help.

I'll be posting another problem with FF reading <table> and <td> styles in another thread.

Jim

[peco]

I guess this is too simple to be the cure but, I'll say it anyway.

If you have a scroll mouse, when on the FF page, press Ctrl and scroll back on the wheel. That should make the text bigger or forward to make it smaller.
If you don't have a scroller mouse, press Ctrl and the + or - key on the calculator keys.

[encyclo]

One of the factors affecting how text-size is handled when using non-pixel units is whether you are in quirks mode or standards-compliance mode [webmasterworld.com]. For best results you should always be using a full doctype to trigger standards-compliance mode in modern browsers.