IE font-size

[Harris Kosmidis]

I have a site up and running (www.solsoft.gr). I tested it with FF2 and
IE6 and works ok with some IE hacks.

Ok the CSS isn't good cause I started designing it with another look and
the customer ended up wanting a 3-column layout.

Now I see that IE7 mess things up. First of all there's a left margin
which I don't know why it exists. Secondly when I see the page the fonts
are way too big. I first had body{font-size:0.62em} but now changed it
to 11px. If I reload the page (in IE7) the fonts shows good. But why do
I have to reload? (I don't override the CSS with IE7).

Any help is appreciated.

thanks

[John Hosking]

Harris Kosmidis wrote:

I have a site up and running (www.solsoft.gr). I tested it with FF2 and
IE6 and works ok with some IE hacks.

....possibly depending on what you mean by "OK." I can't resize your text
in IE6, and if I resize text in FF or try to make my viewport smaller
than around 890px, the layout breaks.

>
Ok the CSS isn't good cause I started designing it with another look and
the customer ended up wanting a 3-column layout.

Now I see that IE7 mess things up. First of all there's a left margin
which I don't know why it exists.

*where* is the left margin?

Secondly when I see the page the fonts
are way too big.

Funny, for me, they're kind of small. But you mean only in IE7, which I
don't have here.

I first had body{font-size:0.62em} but now changed it
to 11px.

Ooh, *this* can't be the best solution, can it? (Although starting off
with .6em is kind of funny, too.) Now I know why the text is
non-resizable in IE6.

If I reload the page (in IE7) the fonts shows good. But why do
I have to reload? (I don't override the CSS with IE7).

I'm not sure what you mean about overriding here.

>

As mentioned, I haven't seen your page in IE7, but I did look at your
CSS. I see you have some attempts at using the underscore hack, as in
_margin-left:-6px;. Perhaps you are not aware that IE7 will ignore this
rule. Have a read through this article, for some discussion of that and
other IE7-CSS specialities:
http://msdn.microsoft.com/library/de...css_compat.asp
Ooh, yuck; long URL. Try this: http://tinyurl.com/b245h.

By the way, most of your page is in dark red text, on a garish pink
background, because that's what I currently have as my default. But your
sollogo.gif image assumes a white background, and things don't look so
nice. Something (else) to think about!

Run your page through the W3C validator. Also, I don't know why you want
to ust transitional; it looks like you could use 4.01, strict.

HTH
--
John

[Harris Kosmidhs]

So what's the suggestion about font-size? .6em? The problem is that IE7
renders the page quite good if I press reload. If you visit a link the
fonts are big. If you reload the fonts are small. I can't understand
this "reload" behavior.

The other problem (not mentioned in my first post) is the <div
id="address"(not the webdesign part, but the previous with the
telephone). I want to center it to the main middle div. I have put it
there but while FF renders it where it should be bith IE6/7 doesn't.

John Hosking wrote:

Harris Kosmidis wrote:

>I have a site up and running (www.solsoft.gr). I tested it with FF2 and
IE6 and works ok with some IE hacks.

...possibly depending on what you mean by "OK." I can't resize your text
in IE6, and if I resize text in FF or try to make my viewport smaller
than around 890px, the layout breaks.

>>
Ok the CSS isn't good cause I started designing it with another look and
the customer ended up wanting a 3-column layout.

Now I see that IE7 mess things up. First of all there's a left margin
which I don't know why it exists.

*where* is the left margin?

>Secondly when I see the page the fonts
are way too big.

Funny, for me, they're kind of small. But you mean only in IE7, which I
don't have here.

>I first had body{font-size:0.62em} but now changed it
to 11px.

Ooh, *this* can't be the best solution, can it? (Although starting off
with .6em is kind of funny, too.) Now I know why the text is
non-resizable in IE6.

>If I reload the page (in IE7) the fonts shows good. But why do
I have to reload? (I don't override the CSS with IE7).

I'm not sure what you mean about overriding here.

>>

As mentioned, I haven't seen your page in IE7, but I did look at your
CSS. I see you have some attempts at using the underscore hack, as in
_margin-left:-6px;. Perhaps you are not aware that IE7 will ignore this
rule. Have a read through this article, for some discussion of that and
other IE7-CSS specialities:
http://msdn.microsoft.com/library/de...css_compat.asp

Ooh, yuck; long URL. Try this: http://tinyurl.com/b245h.

By the way, most of your page is in dark red text, on a garish pink
background, because that's what I currently have as my default. But your
sollogo.gif image assumes a white background, and things don't look so
nice. Something (else) to think about!

Run your page through the W3C validator. Also, I don't know why you want
to ust transitional; it looks like you could use 4.01, strict.

HTH

[Michael Fesser]

..oO(Harris Kosmidhs)

>So what's the suggestion about font-size? .6em?

1em / 100%

Micha

[Harris Kosmidhs]

Michael Fesser wrote:

.oO(Harris Kosmidhs)

>So what's the suggestion about font-size? .6em?

1em / 100%

Micha

then I get *extremely* huge letters

[Andy Dingley]

Harris Kosmidhs wrote:

Michael Fesser wrote:

So what's the suggestion about font-size? .6em?

1em / 100%

then I get *extremely* huge letters

Then set _your_ browser to use a more sensible default text size.

The rest of us (and there are more of us) get a sensible default size
at 1em and we get unreadably small text at 0.6em
The default for "1" is "1". It's a default. It means don't mess with
it, don't change it, just leave it at "1 times" the default size.

[Michael Fesser]

..oO(Harris Kosmidhs)

>Michael Fesser wrote:

>.oO(Harris Kosmidhs)

>>So what's the suggestion about font-size? .6em?

1em / 100%

then I get *extremely* huge letters

It just depends on your personal browser settings and the used font on
the site. Of course Verdana will look way too big at 100%, which is one
reason to avoid Verdana at all. Other fonts are sized more reasonably.

Micha

[Sherm Pendley]

Harris Kosmidhs <hk******@remove.me.softnet.tuc.grwrites:

Michael Fesser wrote:

>.oO(Harris Kosmidhs)

>>So what's the suggestion about font-size? .6em?

1em / 100%

Micha

then I get *extremely* huge letters

If your browser's default is too large, adjust the default in your browser.

Marking up the pages you create to compensate for your browser's setting
will result in *you* seeing what you want to see on *your* browser, but
the type will then be tiny for everyone else.

sherm--

--
Web Hosting by West Virginians, for West Virginians: http://wv-www.net
Cocoa programming in Perl: http://camelbones.sourceforge.net

[Bergamot]

Harris Kosmidhs wrote:

Michael Fesser wrote:

>>
1em / 100%

then I get *extremely* huge letters

*extremely* huge letters can result in IE when fonts are set in em
units. It's a well-known bug. Use % units instead (100% for normal
paragraph text) and font scaling is more rational. If you're so
concerned about the type size, stay away from Verdana or other fonts
that have a larger than average aspect ratio.

--
Berg

[VK]

Bergamot wrote:

*extremely* huge letters can result in IE when fonts are set in em
units. It's a well-known bug. Use % units instead (100% for normal
paragraph text) and font scaling is more rational.

IE's font scaling is very rational taking into account that its Font
Size switch has only five grades: Largest, Larger, Medium (default),
Smaller, Smaller - against of 14-20 grades on other UAs. This way it's
pre-programmed to make bigger "jumps" on size switch. Using %% allows
to break this behavior so align the "jumps" with other UAs - but I
would *not* suggest doing it because it doesn't add extra grades to the
switch so IE users with big monitors even with the font size Biggest
will not be able to get the desired size. I already had several request
of "how to make my font bigger for this site" and each time it was
either px size or %%.
If one really wants to use %% then don't forget to add custom size
switch on the page for IE users.

If you're so concerned about the type size, stay away from Verdana or other fonts
that have a larger than average aspect ratio.

Sorry to say, but what a strange (softest to say) advise.

[Michael Fesser]

..oO(VK)

>Bergamot wrote:

>*extremely* huge letters can result in IE when fonts are set in em
units. It's a well-known bug. Use % units instead (100% for normal
paragraph text) and font scaling is more rational.

IE's font scaling is very rational taking into account that its Font
Size switch has only five grades: Largest, Larger, Medium (default),
Smaller, Smaller - against of 14-20 grades on other UAs. This way it's
pre-programmed to make bigger "jumps" on size switch.

It's still a bug. A font size of 1.5em should be equal to 150%, but IE
gets it wrong for any other setting than Medium.

>If you're so concerned about the type size, stay away from Verdana or other fonts
that have a larger than average aspect ratio.

Sorry to say, but what a strange (softest to say) advise.

It's a good advice. Why do many people reduce the font size in their
stylesheets to something around 80%? Because often they use Verdana,
which appears much bigger than other fonts (for example Trebuchet),
where resizing would not be necessary at all.

Micha

[Bergamot]

VK wrote:

>
If one really wants to use %% then don't forget to add custom size
switch on the page for IE users.

That is very poor advice. Browsers already have a means to adjust the
type size to the user's liking. If you leave body text font-size at 100%
(the user's own default value) the likelihood they will need to adjust
the size at all is slim to none.

It does not benefit the user in any way to implement a custom font size
adjustment function. If you really want to help them, then send them to
a page that explains how to change the font size in their browser. That
is something they can use anywhere, not just at one site.

>If you're so concerned about the type size, stay away from Verdana or other fonts
that have a larger than average aspect ratio.

Sorry to say, but what a strange (softest to say) advise.

No, it isn't. The subject of Verdana has been done to death. I have no
interest in dredging it up again, either and I'm sure the regulars here
cringe at the thought of hearing it again, too. Go search the google
archives if you want to read more discussions on it.

--
Berg

[VK]

Michael Fesser wrote:

A font size of 1.5em should be equal to 150%

Really? Says who? MSDN explains it better and cleaner but "there is no
trust to Microsoft" :-) so here the original W3C stuff:

<http://www.w3.org/TR/CSS21/syndata.html#value-def-percentage>
Percentage values are always relative to another value, for example a
length. Each property that allows percentages also defines the value to
which the percentage refers. The value may be that of another property
for the same element, a property for an ancestor element, or a value of
the formatting context (e.g., the width of a containing block). When a
percentage value is set for a property of the root element and the
percentage is defined as referring to the inherited value of some
property, the resultant value is the percentage times the initial value
of that property.

<http://www.w3.org/TR/CSS21/syndata.html#value-def-length>
The 'em' unit is equal to the computed value of the 'font-size'
property of the element on which it is used. The exception is when 'em'
occurs in the value of the 'font-size' property itself, in which case
it refers to the font size of the parent element.

So what is so equal in here? IE implements much shorter font size
switch scale (Largest-Larger-Medium-Smaller-Smallest) and respectively
bigger size jumps for body font (which is used to calculate the actual
1em value).

At the same time they give %% attached to the *initial* body font size
(when the switch is on Medium) which is their holly right. That allows
to implement custom font size switch with as many positions as one
wants.

But simply breaking the default switch without providing an alternate
one is a very bad practice, especially now with monitors going bigger
and bigger.

Why do many people reduce the font size in their
stylesheets to something around 80%? Because often they use Verdana,
which appears much bigger than other fonts (for example Trebuchet),
where resizing would not be necessary at all.

Not sure what are you talking about. At the time of no CSS at all we
still had to declare <font face="Times New Roman, serif" size="3">
but
<font face="Arial, sans-serif" size="2">
to make them close by size looking on Windows (Arial size 3 was too
near of Times size 3; Times size 2 was too small to read with comfort).
I don't know why Verdana (which is an excellent font specially designed
for the Web) is being chosen as "blame it for everything" :-)

[VK]

If you're so concerned about the type size, stay away from Verdana or other fonts

that have a larger than average aspect ratio.

Sorry to say, but what a strange (softest to say) advise.

No, it isn't. The subject of Verdana has been done to death.

As well as "em bug on IE" I presume ;-) - otherwise it wouldn't be
called "well known bug" in this thread when it is not a bug and it is
not known AFAIK anywhere else outside of ciwas.

[Michael Fesser]

..oO(VK)

>Michael Fesser wrote:

>A font size of 1.5em should be equal to 150%

Really? Says who?

Simple logic. Obviously 2em should be twice as big as 1em and 200% is
twice as big as 100%.

>I don't know why Verdana (which is an excellent font specially designed
for the Web) is being chosen as "blame it for everything" :-)

http://www.xs4all.nl/~sbpoley/webmatters/verdana.html

Micha

[dorayme]

In article <i6********************************@4ax.com>,
Michael Fesser <ne*****@gmx.dewrote:

...Why do many people reduce the font size in their
stylesheets to something around 80%? Because often they use Verdana,
which appears much bigger than other fonts (for example Trebuchet),
where resizing would not be necessary at all.

More website makers than you can poke a stick at use 80% or
thereabouts for non Verdana too. It is extremely annoying. They
do it because others do it and things look strangely big to them
when fonts are sensibly set (at 1em/100%) for main body text.
Plus they can't get as much crammed into their pages. What the
hell is up with these people who are hell bent on cramming the
contents of the universe into single pages?

--
dorayme

[Bergamot]

VK wrote:

Michael Fesser wrote:

>A font size of 1.5em should be equal to 150%

Really? Says who?

You seem to be confused.

Where font-size is concerned, em and % are equivalent. 1em = 100%. Both
are computed values, based on the font-size of the parent element, which
is initially the user's default size, *whatever that may be*.

<http://www.w3.org/TR/CSS21/syndata.html#value-def-percentage>
Percentage values are always relative to another value,

And in the case of font-size, it's relative to the font-size of the
parent element. The initial value is equivalent to 1em.

<http://www.w3.org/TR/CSS21/syndata.html#value-def-length>
The 'em' unit is equal to the computed value of the 'font-size'
property of the element on which it is used.

Same thing, except it's called em instead of %.

So what is so equal in here? IE implements much shorter font size
switch scale

Which is irrelevant to the discussion. 1em=100%, whether that starts out
as IE 'smallest' or 'largest' size. It's still 1em or 100%.

But simply breaking the default switch

There is nothing broken here, except your understanding of what 1em/100% is.

--
Berg

[VK]

A font size of 1.5em should be equal to 150%

Really? Says who?

Simple logic. Obviously 2em should be twice as big as 1em and 200% is
twice as big as 100%.

The simplicity of this logic is indeed killing :-) It has one "small"
default though by having nothing common with the existing specs.

The hint #1: 200% of say one pound is not the same as 200% of one
ounce.

The hint #2: the initial value where %% are applied to in IE depends on
the current mode (BackCompat vs CSS1Compat). While in the quirk mode
it's counted from Medium, in the "standard compliant" one it's counted
from Smaller. This way putting IE in that mode *and* killing the
default switch behavior by body{font-size:100%} is a usability crime to
be beat down for.

The hint #3 (64K value): before giving browser-specific advises it is
always a good idea to read the relevant producer's documentation:
rather than building the picture solely out of your own mind.

http://www.xs4all.nl/~sbpoley/webmatters/verdana.html

So basically the author says that 1em of one font may be noticeably
unequal to 1em of another font and that's terrible wherever found.
That's a killing argument (with a shiny absence of any screen
typography knowledge demonstrated throughout the article). It is indeed
difficult to argue with such straight and simple logic - so I better
will not.

[Johannes Koch]

VK schrieb:

The hint #1: 200% of say one pound is not the same as 200% of one
ounce.

The hint #2: the initial value where %% are applied to in IE depends on
the current mode (BackCompat vs CSS1Compat). While in the quirk mode
it's counted from Medium, in the "standard compliant" one it's counted
from Smaller.

So you say that the basis for the calculation of the font size defined
in em or % are different where they should be equal (the parent
element's font size)?

I would call this a bug.
--
Johannes Koch
In te domine speravi; non confundar in aeternum.
(Te Deum, 4th cent.)

[David Stone]

In article <45***********************@authen.yellow.readfreen ews.net>,
Johannes Koch <ko**@w3development.dewrote:

VK schrieb:

The hint #1: 200% of say one pound is not the same as 200% of one
ounce.

The hint #2: the initial value where %% are applied to in IE depends on
the current mode (BackCompat vs CSS1Compat). While in the quirk mode
it's counted from Medium, in the "standard compliant" one it's counted
from Smaller.

So you say that the basis for the calculation of the font size defined
in em or % are different where they should be equal (the parent
element's font size)?

But isn't % based on the height, while em is based on the width of
_a specific character_ ? So % and em, while valid size units, would
NOT be expected to give the same vertical screen size for text.

I would call this a bug.

I would call it a misconception. To borrow from hint #1 above, it
would be more like calculating relative amounts of weight versus
volume, rather than simply weight in different units.

[VK]

Johannes Koch wrote:

So you say that the basis for the calculation of the font size defined
in em or % are different where they should be equal (the parent
element's font size)?

em and % are *relative* inits. It means that no matter what: there must
be at least one *absolute* unit somewhere (implicit or explicit) from
which all other calculations are made.
With body{font-size:100%} where do you propose to look for to calculate
100% of? html element? * html? :-)

I would call this a bug.

A bug is a behavior going against the provided specification. A
producer-documented behavior is a feature: standard or non-standard is
another question. Though reading through W3C I see no requirements to
call this behavior non-standard.
<http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/fontsize.asp>

[Michael Fesser]

..oO(David Stone)

>But isn't % based on the height, while em is based on the width of
_a specific character_ ?

Not in CSS:

| The 'em' unit is equal to the computed value of the 'font-size'
| property of the element on which it is used.

Micha

[Darin McGrew]

Johannes Koch wrote:

>So you say that the basis for the calculation of the font size defined
in em or % are different where they should be equal (the parent
element's font size)?

VK <sc**********@yahoo.comwrote:

em and % are *relative* inits. It means that no matter what: there must
be at least one *absolute* unit somewhere (implicit or explicit) from
which all other calculations are made.

Exactly.

With body{font-size:100%} where do you propose to look for to calculate
100% of? html element? * html? :-)

The absolute unit *should* be the font size the user's browser is
configured to use. That's the whole point of using relative units for font
sizes. As Todd Fahrner wrote some time ago:

The font size chosen by the user as a comfortable default (1 em)
provides more truly useful information about the rendering
environment than all the resolution-sniffing, window-querying,
"open-this-wide" logic you can throw at the problem.

And in this sense, 100% and 1em are equivalent. The only practical
difference is that MSIE has a nasty bug in its implementation of em units,
which can be worked around by specifying "body {font-size: 100%}" in the
document style sheet.
--
Darin McGrew, mc****@stanfordalumni.org, http://www.rahul.net/mcgrew/
Web Design Group, da***@htmlhelp.com, http://www.HTMLHelp.com/

"I used to have a handle on life, but it broke."

[VK]

Darin McGrew wrote:

The absolute unit *should* be the font size the user's browser is
configured to use.

Right. And on my current 1024x768 96dpi LCD it's 12pt (Medium). But on
my other 1280x1024 I'm comfortable with 14pt (Larger).
Please note: 12 and 14 pt (points), not px (pixels) - because these are
initial values for IE's font size switch.

And in this sense, 100% and 1em are equivalent. The only practical
difference is that MSIE has a nasty bug in its implementation of em units,
which can be worked around by specifying "body {font-size: 100%}" in the
document style sheet.

No, Mister, what you *really* want to do it's to enforce a tiny
per-pixel step scale on IE users because "proper" UAs are using it. So
you want them to have their Largest just like if I press Ctrl+0 and
then twice Ctrl++ in Firefox.
If you worked for me and I catched you on the act, that would be a full
business week w/o doughnuts to you - and that's just for the first time
:-) :-|

[Bergamot]

VK wrote:

>
With body{font-size:100%} where do you propose to look for to calculate
100% of?

Whatever the user's browser default font size is. That may be any one of
IE's selectable values from smallest to largest, not a fixed 'Medium'
(or whatever) as you claim. Other browsers give the user more precise
control than IE does.

And again, 1em is the same initial value.

--
Berg