How do prevent text size increase on html/css [closed]

Question

this website looks very nice, although the've managed to prevent the user to increase/decrease the font size through the browser facility.

http://simplegeo.com/

If you check the Zoom Text Only option on your browser and try to zoom in or zoom out (usually ⌘+ / ⌘- or ctrl+ / ctrl-) you can see that the font-size doesn't change.

How can I replicate the same effect?

I am thinking that this would be nice to prevent items from menu or purely layout based elements and leave only the main text be affected.

Answer 1

From looking at their CSS, it might be this line of code: -webkit-text-size-adjust:none; If so, it'd only work in a limited number of browsers, not everywhere.

There's not much reason you should be preventing users from adjusting text size, though. Yes, it might cause problems with the design, but you could also argue that the design should be flexible enough to deal with font size changes.

Comedy option: replace all your text with images.

Answer 2

Use the following CSS code.

<style type="text/css">
-webkit-text-size-adjust:none;
-ms-text-size-adjust:none;
-moz-text-size-adjust:none;
text-size-adjust:none;
</style>