10 replies [Last post]
middy
Offline
newbie
England
Last seen: 15 years 27 weeks ago
England
Joined: 2004-01-07
Posts: 7
Points: 0

I am having problems with the font size in Mozilla compared to IE and I'm hoping someone can help.

I have set the following in my CSS

font-sizex-small;

or

font-sizexx-small;

but the font size appears much smaller in Mozilla than IE. Any suggestions please?

thanks

Daybreak_0
Offline
Enthusiast
Sydney, Australia
Last seen: 15 years 35 weeks ago
Sydney, Australia
Timezone: GMT+10
Joined: 2003-11-15
Posts: 389
Points: 0

font size difference between IE and Mozilla

Can you provide a link to the page and all the code so we can see in action.

Day

The only way to learn is to do it yourself

middy
Offline
newbie
England
Last seen: 15 years 27 weeks ago
England
Joined: 2004-01-07
Posts: 7
Points: 0

font size difference between IE and Mozilla

the site is www.ifslearning.com

In IE you can view all the pages of the site but in Mozilla you will only be able to see some pages working properly as we have code in the css to help IE 5.0 users which is now causing problems in mozilla which we are in the process of correcting.

Not sure how much code you want as my style sheets are a bit lengthy?

any ideas appreciated.

Daybreak_0
Offline
Enthusiast
Sydney, Australia
Last seen: 15 years 35 weeks ago
Sydney, Australia
Timezone: GMT+10
Joined: 2003-11-15
Posts: 389
Points: 0

font size difference between IE and Mozilla

I never used x-small, etc, so will make some assumptions here.

IE has a default font of 16px, so if 1em is used as a font size it is the same as 100%, and so you get 16px on the screen.

I think (but do not know) that Moz uses a smaller font size as default.

Therefore if x-small, etc are translational sizes (like em) you have a problem with the starting size.

----------

So you have to give the doc a default font size. Try adding in css

body{font-size: 16px} being what you wanted or whatever size that works, and most tags, divs should inherit the size, and make adjustments based on x-small, etc.

The only problem that may occur is where you have some element or div that does not inherit, and you may have to give it a specific size.

Regards
Day

The only way to learn is to do it yourself

middy
Offline
newbie
England
Last seen: 15 years 27 weeks ago
England
Joined: 2004-01-07
Posts: 7
Points: 0

font size difference between IE and Mozilla

Thanks for the help. However it doesn't seem to matter what size I change the body to - it makes no difference. Most of my main text seems to be adjusted by the td class and I can specify this to a px and it works in both browsers but I can then not change the font as a user in IE, which I need users to be able to do.
I have read about setting a base font up before but I'm not sure how to put that in the CSS?

This is the body and td code I was using.

body {color #000000;background-color #ffffff;font-familyArial, Helvetica, sans-serif;font-size12px;font-style normal;font-weight normal;font-variant normal;text-align justify;}
td {font-familyarial, Helvetica, sans-serif;font-sizex-small;color#000000;background-position left top;vertical-aligntop;left0px;top0px;}

any help much appreciated

gospastic
Offline
newbie
Denmark
Last seen: 15 years 29 weeks ago
Denmark
Joined: 2003-12-29
Posts: 3
Points: 0

font size difference between IE and Mozilla

You have your font-size to x-small in your table,,, so if all your text is in a table, the x-small will still be active...
try changing the td font size to 12px as well

middy
Offline
newbie
England
Last seen: 15 years 27 weeks ago
England
Joined: 2004-01-07
Posts: 7
Points: 0

font size difference between IE and Mozilla

Thanks but if I change the font size to 12px in the table then it is set and users are not able to adjust the font size in IE?

Daybreak_0
Offline
Enthusiast
Sydney, Australia
Last seen: 15 years 35 weeks ago
Sydney, Australia
Timezone: GMT+10
Joined: 2003-11-15
Posts: 389
Points: 0

font size difference between IE and Mozilla

Sorry did not delve into the code enough, and did not know you are using tables. Unfortunately I seem to remember reading that Tables do not inherit.

You could try this

table{font-size: 16px}
table td{font-size: 0.8em} or leave it as you have it.

So we are setting table to the default size but using em for the data to make it smaller, which should change if users changes text size view.

Regards
Day

The only way to learn is to do it yourself

middy
Offline
newbie
England
Last seen: 15 years 27 weeks ago
England
Joined: 2004-01-07
Posts: 7
Points: 0

font size difference between IE and Mozilla

thanks for the help.

I had realised that the default for IE is 18px and 16 px in Mozilla. I have set the table class to 18px leaving the td at x-small . This has now set the main body text that has no applied style to the correct size but nothing else in the menu etc has changed.

The page looks fine when when I reset the default in Mozilla to 18 but I cna't expect users to do this. Is there any other way?

cheers

Daybreak_0
Offline
Enthusiast
Sydney, Australia
Last seen: 15 years 35 weeks ago
Sydney, Australia
Timezone: GMT+10
Joined: 2003-11-15
Posts: 389
Points: 0

font size difference between IE and Mozilla

18px hmm thought it was 16px for IE. ah well whats 2px anyway Smile

I am looking at your site and the CSS and there is no font size set in the css for table? Although it looks like 14px is set for body??

I can see an empty .table {} and suggest not to create a class with same name as a normal table especially as you already have table set.

Just to make sure - the link you provided is the one you are working on?

It does not make sense it is working correctly in one place and not another.

Regards
Day

The only way to learn is to do it yourself

skyrocket
skyrocket's picture
Offline
Enthusiast
Sydney - Australia
Last seen: 15 years 30 weeks ago
Sydney - Australia
Timezone: GMT+10
Joined: 2003-12-18
Posts: 71
Points: 0

font size difference between IE and Mozilla

Yes the default font size in IE is 16px

This topic causes much heated debate among geeks and web gurus so I'm not going to comment except to say - read these... Arrow

http://www.maxdesign.com.au/presentation/relative/
http://www.thenoodleincident.com/tutorials/box_lesson/font/
http://www.humanfactors.com/downloads/fontsize.asp

PAUL - SkyRocket Design Co
web design sydney northern beaches