Stylesheets - Without Microsoft font specs x-small is bigger than small for Verdana

Author

Without Microsoft font specs x-small is bigger than small for Verdana

Randall Parker

2004-07-16, 11:15 pm

Using IE 6.x (whatever is the latest) on Windows 2000.

For these two CSS definitions if I remove the 2 lines that have the
"mso-" font family definitions (mso-fareast-font-family, and
mso-bidi-font-family) then the "SmallerText" assigned as a class to a
div tag produces larger text than the "SmallerText2". So x-small is
treated as a bigger font size than plain old small.

How the heck is one supposed to know all the MS stuff one needs to add
to CSS to make CSS behave the way it is supposed to in IE?

Also, x-small, small and medium are bigger in IE than in Mozilla. How
to adjust for this to make pages look the same on both browsers and
yet still use relative font sizes?

div.SmallerText
{color:#000;
margin:0in;
margin-bottom:.0001pt;
punctuation-wrap:simple;
text-autospace:none;
font-size:x-small;
font-family:"Verdana,Arial";
mso-fareast-font-family:"Verdana,Arial";
mso-bidi-font-family:"Verdana,Arial";}
div.SmallerText2
{color:#000;
margin:0in;
margin-bottom:.0001pt;
punctuation-wrap:simple;
text-autospace:none;
font-size:small;
font-family:"Verdana,Arial";
mso-fareast-font-family:"Verdana,Arial";
mso-bidi-font-family:"Verdana,Arial";}

C A Upsdell

2004-07-17, 4:15 am

"Randall Parker" <techiepundit@futurepundit.com> wrote in message
news:d7ce4c24.0407161503.68b6064a@posting.google.com...
> Using IE 6.x (whatever is the latest) on Windows 2000.
>
> For these two CSS definitions if I remove the 2 lines that have the
> "mso-" font family definitions (mso-fareast-font-family, and
> mso-bidi-font-family) then the "SmallerText" assigned as a class to a
> div tag produces larger text than the "SmallerText2". So x-small is
> treated as a bigger font size than plain old small.
>
> How the heck is one supposed to know all the MS stuff one needs to add
> to CSS to make CSS behave the way it is supposed to in IE?
>
> Also, x-small, small and medium are bigger in IE than in Mozilla. How
> to adjust for this to make pages look the same on both browsers and
> yet still use relative font sizes?
>
>
> div.SmallerText
> {color:#000;
> margin:0in;
> margin-bottom:.0001pt;
> punctuation-wrap:simple;
> text-autospace:none;
> font-size:x-small;
> font-family:"Verdana,Arial";
> mso-fareast-font-family:"Verdana,Arial";
> mso-bidi-font-family:"Verdana,Arial";}
> div.SmallerText2
> {color:#000;
> margin:0in;
> margin-bottom:.0001pt;
> punctuation-wrap:simple;
> text-autospace:none;
> font-size:small;
> font-family:"Verdana,Arial";
> mso-fareast-font-family:"Verdana,Arial";
> mso-bidi-font-family:"Verdana,Arial";}

A few things,

First, your CSS is not valid. Run it through the CSS validator. E.g., in
font-family:"Verdana,Arial", drop the quotes: there is no font named
"Verdana,Arial".

Second, mso-fareast-font-family and mso-bidi-font-family are not valid CSS.
I don't know what IE will do with this, but other browsers will ignore it.

Third, punctuation-wrap is also not valid CSS. Neither is text-autospace.

Fourth, font sizing is different with IE6 than it is with IE 4 or IE5. You
should code around this.

I suggest that you review the CSS specs and go back to the drawing board.

Randall Parker

2004-07-17, 7:14 am

To answer my own question about font sizes: The problem has to do with
DOCTYPE. MS Word's export of HTML doesn't appear to specify the
DOCTYPE. If IE doesn't find a DOCTYPE at the type it goes into its own
quirky extended different way of interpreting CSS.

I put this DOCTYPE at the top of the document and then began fixing
the CSS and HTML to be more consistent in hehavior across browser:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">

techiepundit@futurepundit.com (Randall Parker) wrote in message news:<d7ce4c24.0407161503.68b6064a@posting.google.com>...
> Using IE 6.x (whatever is the latest) on Windows 2000.
>
> For these two CSS definitions if I remove the 2 lines that have the
> "mso-" font family definitions (mso-fareast-font-family, and
> mso-bidi-font-family) then the "SmallerText" assigned as a class to a
> div tag produces larger text than the "SmallerText2". So x-small is
> treated as a bigger font size than plain old small.
>
> How the heck is one supposed to know all the MS stuff one needs to add
> to CSS to make CSS behave the way it is supposed to in IE?
>
> Also, x-small, small and medium are bigger in IE than in Mozilla. How
> to adjust for this to make pages look the same on both browsers and
> yet still use relative font sizes?

Steve Pugh

2004-07-17, 12:14 pm

techiepundit@futurepundit.com (Randall Parker) wrote:

>To answer my own question about font sizes: The problem has to do with
>DOCTYPE. MS Word's export of HTML doesn't appear to specify the
>DOCTYPE. If IE doesn't find a DOCTYPE at the type it goes into its own
>quirky extended different way of interpreting CSS.

In quirks mode IE treats CSS font-size: small; as being equivalent to
the browser default. In standards mode it treats CSS font-size:
medium; as being equivalent to the browser default.

Also note that some doctypes trigger quirks mode, so it's not just a
case on including a doctype, but a case of including the right one.

>I put this DOCTYPE at the top of the document and then began fixing
>the CSS and HTML to be more consistent in hehavior across browser:
><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
>"http://www.w3.org/TR/html4/frameset.dtd">

You should only use that doctype on a frameset page. As IE is
incapable of displaying the contents of <noframes> there is no way
that you could have seen the text sizing issue. A non-frameset page
(even one that is displayed inside a frameset) should use a different
doctype.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <steve@pugh.net> <http://steve.pugh.net/>

Christoph Paeper

2004-07-17, 7:16 pm

Am Sat, 17 Jul 2004 16:06:06 +0100 schrieb Steve Pugh <steve@pugh.net>:
> Brian <usenet3@julietremblay.com.invalid> wrote:

Well, it handles it correctly by not displaying it, when there are frames
it can use. OTOH it also erronously does not display the content of
'noframes', when there are no frames.
[color=darkred]
> Really? How do you configure IE to display the <noframes> content
> instead of the frames?

Funny,

frame {display: none}

more or less works, but

noframes, noframes * {display: block}

does not.

--
A bus station is where a bus stops,
a train station is where a train stops,
on my desk I have a work station...

Steve Pugh

2004-07-22, 7:18 pm

Brian <usenet3@julietremblay.com.invalid> wrote:
>Steve Pugh wrote:
>
>
>Surely it can handle <noframes>!

Really? How do you configure IE to display the <noframes> content
instead of the frames? (IIRC Mac IE 3 had such an option but no other
version of IE has). If you can't then my original point, that the OP
couldn't have observed the font sizing issue in a page correctly using
a frameset doctype stands.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <steve@pugh.net> <http://steve.pugh.net/>