CSS text size

[agibbs1983]

Could anyone help me with problem! i havent used CSS that much before! the problem is that i want to allow users to change the size of the text within my website but i having problems doing this from the browser (the text stays the default size i have set) !! I don't want to use javascript is there any code that i could use that lets the user click an image to change the text size (i have seen this on many websites and would like to do it on mine) ! Any help in this matter would be greatful.

Cheers Andy

[ahm531]

Originally Posted by agibbs1983

(i have seen this on many websites and would like to do it on mine)

Can you list some of the site you have seen this option on.
That will help more in understanding what you want!

[Ryan Fait]

The problem is that some browsers (most notably IE) won't let the user change the text size if it's set to an absolute size. Using a 12px for a font size, for instance. There is a way to get around this, however. Instead of using px or other measurements, use em.

font-size: 1em;

As the em measurement is relavent, you're going to want to reduce it globally in your CSS file so the numbers are easier to use. Add this to the body tag:

Code: Select all

body {
    font-size: 70%;
}

Here are some examples of it in use:

Code: Select all

h1 {
    font-size: 3em;
}
h2 {
    font-size: 1.8em;
}
h3 {
    font-size: 1.2em;
}
p {
    font-size: 1em;
}

[agibbs1983]

Cheers for all the help! Here is a couple of site address i have seen this on,

http://www.dsgiplc.com, (located in the top right corner of website)

hope you know what i mean!!

[Ryan Fait]

Ah. That's not really a CSS thing. You need JavaScript to effect the changes. The first Google result for "text size changer"...

http://www.dyn-web.com/dhtml/sizefont/index.php