font-size and Opera

J

JH

Can someone explain why Opera renders the following with a different font
size than either Firefox or IE:

<p style="font-family: 'Trebuchet MS';">Hi</p>
<p style="font-family: 'Trebuchet MS'; font-size: 80%;">Hi</p>

The 80% is smaller in Opera than in IE6 or Firefox. I have the latest
version of Opera.

How can I fix this using all % fonts.

Thanks.
 
D

Dylan Parry

JH said:
Can someone explain why Opera renders the following with a different font
size than either Firefox or IE:
[...]

Most likely your personal settings. You can generally, in a good
browser, specify your preferred font and size. I'm guessing here, but
the likeliness is that in Opera, your preferred font size is smaller
than that of Firefox or Internet Explorer.

Like all matters regarding fonts, you can't change the way that fonts
will appear on other people's browsers, but you can of course change the
settings in your own. Be aware that other people's browsers will very
likely have different settings to your own anyway, so you can't
guarantee that your fonts will look the same on their screens, but you
can at least rest assured that the ratio (eg. the size of headings to
paragraphs) will remain the same (caveat: as long as the text isn't
smaller than the user's defined minimum font size).

In Opera, for example, your font settings are in "tools > preferences >
advanced > fonts", and in Firefox they are in "tools > options > content
fonts & colors > advanced". I'd suggest taking a look at the settings
in there to see what is different between the two, or alternatively just
accept that it is how it is ;)

--
Dylan Parry
http://electricfreedom.org | http://webpageworkshop.co.uk

Programming, n: A pastime similar to banging one's head
against a wall, but with fewer opportunities for reward.
 
J

JH

I think I have overcome the problem by using 100% in the body tag and for
the rest to use em. But I am still curious to know why % values cause this
problem with Opera.
 
D

Dylan Parry

JH said:
I think I have overcome the problem by using 100% in the body tag and for
the rest to use em. But I am still curious to know why % values cause this
problem with Opera.

That is odd. I haven't come across this problem before, so presumed it
was a settings issue! I suppose it is akin to the 'em' problem
encountered in Internet Explorer (is that fixed in IE7?)

--
Dylan Parry
http://electricfreedom.org | http://webpageworkshop.co.uk

Programming, n: A pastime similar to banging one's head
against a wall, but with fewer opportunities for reward.
 
S

Steve Pugh

Can someone explain why Opera renders the following with a different font
size than either Firefox or IE:

<p style="font-family: 'Trebuchet MS';">Hi</p>
<p style="font-family: 'Trebuchet MS'; font-size: 80%;">Hi</p>

The 80% is smaller in Opera than in IE6 or Firefox. I have the latest
version of Opera.

In my Opera both lines are very different to what IE show, but then I
have different defaults in Opera than I do in IE.

Anyway, Opera always rounds _down_ to the whole pixel. So, if 80% was
12.9 pixels then IE and FF would show the text as 13 pixels and Opera
would show it as 12 pixels. I reported this a bug years and several
versions ago but no fix yet. :-(
How can I fix this using all % fonts.

I wouldn't worry about it. You're going to get much bigger differences
for people with different default sizes, minimum sizes, etc.

Steve
 
E

Ed Seedhouse

Can someone explain why Opera renders the following with a different font
size than either Firefox or IE:

<p style="font-family: 'Trebuchet MS';">Hi</p>
<p style="font-family: 'Trebuchet MS'; font-size: 80%;">Hi</p>

The 80% is smaller in Opera than in IE6 or Firefox. I have the latest
version of Opera.

How can I fix this using all % fonts.

Ultimately you can't. You can't make all browsers render any page
exactly the same as all other browsers. You don't have control over
that, and trying to get control over that is an exercise in futility.
The Web is a flexible medium and that's just the way things are.
 
T

Toby Inkster

JH said:
The 80% is smaller in Opera than in IE6 or Firefox. I have the latest
version of Opera.

How many of your visitors are likely to compare these three renderings
side-by-side? Hint: none of them. As long as it looks reasonably good in
the all, what's the problem?
 
A

Adrienne Boswell

Anyway, Opera always rounds _down_ to the whole pixel. So, if 80% was
12.9 pixels then IE and FF would show the text as 13 pixels and Opera
would show it as 12 pixels. I reported this a bug years and several
versions ago but no fix yet. :-(

Thanks for clearing that up. I use Opera at work for my development
browser, and always wondered why that was. It doesn't matter to me and the
boss only cares about IE6.
 
A

Andy Dingley

How many of your visitors are likely to compare these three renderings
side-by-side? Hint: none of them.

One of them. Your boss / customer.

This simple fact is one of the greatest current barriers to progress
in web design. 8-(
 
D

dorayme

"Andy Dingley said:
One of them. Your boss / customer.

This simple fact is one of the greatest current barriers to progress
in web design. 8-(

How come today you are saying things that are not just true, but
deeply true? Whatever, you are on a roll.
 
A

Andy Dingley

How come today you are saying things that are not just true, but
deeply true? Whatever, you are on a roll.

It's a particularly fine night for propagation of the Optical
Telegraph to Mars.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,769
Messages
2,569,580
Members
45,054
Latest member
TrimKetoBoost

Latest Threads

Top