Text Size in IE & FF

[sladmin]

Hi,

I have been designing a site for one of my clients and as part of Norfolk County Councils (NCC) request I have had to make the website W3 accessible. This is not a problem although I have come across a little problem which is bugging me. :angry

As some of you may know you can't specify absolute text sizes in the HTML or CSS documents. So, getting rid of them now allows me to resize the text in IE (although FireFox allows it either way because it's a better browser :D). If I specify values the text resize feature does not work.

Ok so I get it working in IE but the default size is 'Medium' and the text comes up HUGE on the website and considering it's the default one is not good. People will be thinking the site has been designed poorly.

Does anyone know a way around this annoying thing?

[DesignWizard]

Can you not just set the default font as Small, Smaller or X-Small?

[sladmin]

Yes you can but if you do that all the other websites you browse will look odd and people will be driven away.

[AlphOmega]

use em's for your font sizes, this will scale fine. But consider this, is the text size adjustment up to you or the browser, therfore should ie resize pixel size fonts - whos at fault the designer or the browser - WCAG doesnt not state this, another grey area.

[Mark Voss]

Text size adjustment should be up to the user, utilising the built in tools in their browser.

The easiest way to keep control of font sizes, make them consistent and also adjustable in the browser is to set a base size in your CSS file:

body,td,th {font-size: 62.5%;} will make all text 10px

Then work from the base size using ems to adjust the font sizes for each element:

h1 {font-size: 2em;} will make main heading text 20px
h2 {font-size: 1.6em;} will sub heading text 16px
p {font-size: 1.2em;} will make paragraph text 12px
etc.
etc.