6 replies [Last post]
seb
Offline
Enthusiast
Last seen: 13 years 29 weeks ago
Joined: 2003-09-20
Posts: 208
Points: 0

http://www.thenoodleincident.com/tutorials/typography/index.html

Basically the gist is use ems for your font sizes, and specify the base size in your body tag as a %age, not an em.

For the percentages use 60, 69, 76, 86 or 93%, for the reasons detailed here:

http://www.thenoodleincident.com/tutorials/typography/incremental_differences.html

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 31 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

Great font sizing article:

You can add these for a pretty comprehensive look at text sizing

http://www.clagnut.com/blog/348/

http://www.alistapart.com/articles/elastic/

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

co2
co2's picture
Offline
Leader
UK
Last seen: 12 years 18 weeks ago
UK
Joined: 2003-09-17
Posts: 721
Points: 0

Great font sizing article:

Yes, been using this method for a while now, and it seems to be the best across browsers.

Still prefer to use pixels if we could, but you know who won't let us! :roll:

The next sentence is true. The previous sentence is false. Discuss...

seb
Offline
Enthusiast
Last seen: 13 years 29 weeks ago
Joined: 2003-09-20
Posts: 208
Points: 0

Great font sizing article:

well there is the alternative of creating multiple style sheets and using a manual javascript switcher on the page like this:

http://www.imperial.ac.uk

co2
co2's picture
Offline
Leader
UK
Last seen: 12 years 18 weeks ago
UK
Joined: 2003-09-17
Posts: 721
Points: 0

Great font sizing article:

Yes, this is also a decent technique, which I've used once or twice. Particularly good for more than simple font-size switching also.

It was well documented on ALA: http://www.alistapart.com/articles/n4switch/

Smile

The next sentence is true. The previous sentence is false. Discuss...

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 31 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

Great font sizing article:

The Imperial collage site is using Paul Sowdens "styleswitcher" js code
as described in an article on ALA and the specific use in enabling font sizing is described in this article,

http://www.alistapart.com/articles/relafont/

It's a very popular bit of script that Paul Sowden wrote and rightly so, very useful; I see more and more sites using it.

Hugo.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

seb
Offline
Enthusiast
Last seen: 13 years 29 weeks ago
Joined: 2003-09-20
Posts: 208
Points: 0

Great font sizing article:

I would only use this script if it was possible to totally disable the text-resizing built into the browser, I don't like the idea of having two different methods of doing the same thing.