Connecting Tech Pros Worldwide Forums | Help | Site Map

how do I implement font size using ems so that they can resize in ie 6 on a pc

newspost2000@yahoo.com
Guest
 
Posts: n/a
#1: Apr 19 '06
http://www.htmldog.com/articles/elasticdesign/demo/

I found this wonderful site the demonstrates how you cannnot resize
text formated using styles in ie 6 if you specify font size using pt
units but you can if you specify font size using em. So guess what...
I tried it and it on my site did not work!

All I did was the following...

I changed my font propery from this

..body { font-size: 10pt }

To this

..body { font-size: 1.2ems }

Keeping in mind that I am not referencing a doctype dtd, I don't know
if this will make a difference or not. All I have for the first tag in
the code is this: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN">

Now I am not entirely sure if I am going to switch measurement units
within my styles to accomodate resizing. I first want to get resizing
to work in ie before I make that decision. I did have my fonts set to
keywords... ie: small, medium and large but there was a descrepency on
the the size that these fonts got rendered in the different browsers
that can get rememied via a doctype dtd that will take ie out of quirks
mode but I want more control than 7 keywords to describe font size.

Big question... how do I implement font size using ems so that they can
resize in ie 6 on a pc?

Please helsp


Andreas Prilop
Guest
 
Posts: n/a
#2: Apr 19 '06

re: how do I implement font size using ems so that they can resize in ie 6 on a pc


On 19 Apr 2006 newspost2000@yahoo.com wrote:
[color=blue]
> http://www.htmldog.com/articles/elasticdesign/demo/
> I found this wonderful site[/color]

| Content-Type: text/html; charset=UTF-8
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"

Clueless!
[color=blue]
> Big question... how do I implement font size using ems so that they can
> resize in ie 6 on a pc?[/color]

Do not specify a font size for your main text!

frederick@southernskies.co.uk
Guest
 
Posts: n/a
#3: Apr 19 '06

re: how do I implement font size using ems so that they can resize in ie 6 on a pc


newspost2000@yahoo.com wrote:[color=blue]
> I changed my font propery from this
>
> .body { font-size: 10pt }
>
> To this
>
> .body { font-size: 1.2ems }[/color]

There's no such unit as "ems". "2em" + "2em" = "4em"!


--
AGw.

Beauregard T. Shagnasty
Guest
 
Posts: n/a
#4: Apr 19 '06

re: how do I implement font size using ems so that they can resize in ie 6 on a pc


newspost2000@yahoo.com wrote:
[color=blue]
> .body { font-size: 1.2ems }[/color]

"em" rather than "ems" as mentioned.

Do consider using just one of them, rather than 1.2 of them though. Or
better yet: use percentages for font sizes, thus eliminating the bug in
some versions of IE where even "em" resizes incorrectly.

body { font-size: 100%; }

Oh, and no dot before 'body'. (Unless you've defined a specific class,
in which case the word 'body' is not appropriate.)

1em or 100% is everyone's default size.

--
-bts
-Warning: I brake for lawn deer
frederick@southernskies.co.uk
Guest
 
Posts: n/a
#5: Apr 19 '06

re: how do I implement font size using ems so that they can resize in ie 6 on a pc


Beauregard T. Shagnasty wrote:[color=blue]
> body { font-size: 100%; }[/color]

[snip]
[color=blue]
> 1em or 100% is everyone's default size.[/color]

Doesn't explicitly defining a font-size of 100% for the body gets round
some of the rendering oddities of IE when dealing with the keywords
(and maybe also measurement in ems)?


--
AGw.

newspost2000@yahoo.com
Guest
 
Posts: n/a
#6: Apr 19 '06

re: how do I implement font size using ems so that they can resize in ie 6 on a pc


Clueless!? Huh, that's not nice.

Question... Why did you include this in your post?
| Content-Type: text/html; charset=UTF-8
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"

What was it that you were trying to highlight?

Also, what do you mean "Do not specify a font size for your main text!
"

How does one specify a font size in their main text?

Beauregard T. Shagnasty
Guest
 
Posts: n/a
#7: Apr 19 '06

re: how do I implement font size using ems so that they can resize in ie 6 on a pc


frederick@southernskies.co.uk wrote:
[color=blue]
> Beauregard T. Shagnasty wrote:[color=green]
>> body { font-size: 100%; }[/color]
>
> [snip]
>[color=green]
>> 1em or 100% is everyone's default size.[/color]
>
> Doesn't explicitly defining a font-size of 100% for the body gets
> round some of the rendering oddities of IE when dealing with the
> keywords (and maybe also measurement in ems)?[/color]

It can. As I seem to remember, it is certain versions/patches of IE that
have the 'em' problem. With a font set at 1em (or some value), and if
the visitor increased from, for example, Text Size: Smaller to say
Medium, the display *doubles* in size. Using percentages instead of em
negates that bug.

--
-bts
-Warning: I brake for lawn deer
Beauregard T. Shagnasty
Guest
 
Posts: n/a
#8: Apr 19 '06

re: how do I implement font size using ems so that they can resize in ie 6 on a pc


newspost2000@yahoo.com wrote:
[color=blue]
> Also, what do you mean "Do not specify a font size for your main text![/color]

If a size is not declared, the visitor still gets his preferred default
size. However, if you do declare a size, you reinforce your committment.
<g>
[color=blue]
> How does one specify a font size in their main text?[/color]

body, td { font-size: 100%; }
h1 { font-size: 150%; }
h2 { font-size: 130%; }
h3 { font-size: 120%; }
.legalese, .footer { font-size: 85%; }

Very few other sizing styles should be needed for most web pages. All
divs, paragraphs, lists will inherit from body.

[Some browsers do not do inheritance from body into tables, hence the td
show in my little sample.]

--
-bts
-Warning: I brake for lawn deer
David Dorward
Guest
 
Posts: n/a
#9: Apr 19 '06

re: how do I implement font size using ems so that they can resize in ie 6 on a pc


newspost2000@yahoo.com wrote:
[color=blue]
> Clueless!? Huh, that's not nice.
>
> Question... Why did you include this in your post?
> | Content-Type: text/html; charset=UTF-8
> | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
>
> What was it that you were trying to highlight?[/color]

The text/html content-type is for HTML documents and XHTML 1.0 documents
which follow the (very fuzzy and dependent on a browser bug) Appendix C
guidelines for HTML compatibility.

XHTML 1.1 is not covered by this and "SHOULD NOT" be served as text/html.
[color=blue]
> Also, what do you mean "Do not specify a font size for your main text!"[/color]

If I were to say: body { font-size: 120%; } then I would be specifying a
font size for the main text. If I were to not do that, then I wouldn't (and
would thus be leaving it at the font size specified in the preferences of
the user's browser - which the user has control over).

--
David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>
Home is where the ~/.bashrc is
frederick@southernskies.co.uk
Guest
 
Posts: n/a
#10: Apr 19 '06

re: how do I implement font size using ems so that they can resize in ie 6 on a pc


Andreas Prilop wrote:[color=blue]
> On 19 Apr 2006 newspost2000@yahoo.com wrote:
>[color=green]
> > http://www.htmldog.com/articles/elasticdesign/demo/
> > I found this wonderful site[/color]
>
> | Content-Type: text/html; charset=UTF-8
> | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
>
> Clueless![/color]

Interesting. I'm getting application/xhtml+xml with Firefox.

[color=blue][color=green]
> > Big question... how do I implement font size using ems so that they can
> > resize in ie 6 on a pc?[/color]
>
> Do not specify a font size for your main text![/color]

I would amend that to:
Do not specify a *fixed* font size for your main text!


--
AGw.

Johannes Koch
Guest
 
Posts: n/a
#11: Apr 19 '06

re: how do I implement font size using ems so that they can resize in ie 6 on a pc


frederick@southernskies.co.uk wrote:[color=blue][color=green]
>>On 19 Apr 2006 newspost2000@yahoo.com wrote:[color=darkred]
>>>http://www.htmldog.com/articles/elasticdesign/demo/[/color][/color][/color]
[color=blue]
> Interesting. I'm getting application/xhtml+xml with Firefox.[/color]

And I'm getting application/xhtml+xml, too, even when I prefer text/html
(Accept: application/xhtml+xml;q=0.9, text/html;q=1.0). Even more clueless.
--
Johannes Koch
Spem in alium nunquam habui praeter in te, Deus Israel.
(Thomas Tallis, 40-part motet)
frederick@southernskies.co.uk
Guest
 
Posts: n/a
#12: Apr 19 '06

re: how do I implement font size using ems so that they can resize in ie 6 on a pc


Johannes Koch wrote:[color=blue]
> frederick@southernskies.co.uk wrote:[color=green][color=darkred]
> >>On 19 Apr 2006 newspost2000@yahoo.com wrote:
> >>>http://www.htmldog.com/articles/elasticdesign/demo/[/color][/color]
>[color=green]
> > Interesting. I'm getting application/xhtml+xml with Firefox.[/color]
>
> And I'm getting application/xhtml+xml, too, even when I prefer text/html
> (Accept: application/xhtml+xml;q=0.9, text/html;q=1.0). Even more clueless.[/color]

Further investigation reveals that Firefox is being given XHTML 1.1,
but IE is being given what claims to be 1.0 Strict.

What a load of old codswallop!


--
AGw.

Felix Miata
Guest
 
Posts: n/a
#13: Apr 20 '06

re: how do I implement font size using ems so that they can resize in ie 6 on a pc


On 06/04/19 12:26 (GMT-0400) newspost2000@yahoo.com apparently typed:
[color=blue]
> http://www.htmldog.com/articles/elasticdesign/demo/[/color]
[color=blue]
> I found this wonderful site the demonstrates how you cannnot resize
> text formated using styles in ie 6 if you specify font size using pt
> units but you can if you specify font size using em. So guess what...
> I tried it and it on my site did not work![/color]
[color=blue]
> All I did was the following...[/color]
[color=blue]
> I changed my font propery from this[/color]
[color=blue]
> .body { font-size: 10pt }[/color]
[color=blue]
>To this[/color]
[color=blue]
> .body { font-size: 1.2ems }[/color]

Very interesting change. On my computers, 1.2em is 14.4pt. Why would you
in switching from pt to em to size text change from undersized text to
oversized text for your .body class? 12pt is the closest estimate of a
physical size for medium you'll find -
http://mrmazda.no-ip.com/auth/bigdef...#sizeresources - but you
can't actually assume medium is any size in particular, which is another
reason to not size text in pt.

P.S. - It didn't work for probably 2 reasons:

1-font-size: 1.2ems is invalid CSS. Check with the CSS validator before
asking for help next time.

2-'.body' is a class, as opposed to 'body', which applies to your entire
page. If you had no class="body" in your markup, then neither of your
above rules would have had anything to apply to.

As you're sure to have seen elsewhere in the thread, it's best to
exercise restraint in sizing web page text, as some size you deem
appropriate stands a good chance of having no useful relationship to the
size your visitor wishes or requires. Here's a checklist you can use to
measure your restraint:
http://mrmazda.no-ip.com/auth/userdefaultbased.html
--
"Have nothing to do with the fruitless deeds of darkness, but
rather expose them." Ephesians 5:11 NIV

Team OS/2 ** Reg. Linux User #211409

Felix Miata *** http://mrmazda.no-ip.com/auth/auth
Closed Thread


Similar HTML / CSS bytes