How To Exclude Some Text From Browser Zoom

Yes, I know this is probably a bad thing to want to do. I have converted a web site to Drupal. I think I've done a reasonably good clean job with the markup and CSS starting with t

Solution 1:

The reason the old site never zoomed is because he used images for the navigation. The two zooming functions you mention do not zoom-in on images, only pure text, so they stayed the same.

The problem with your current design is that you are using text (which is arguably the right way to go), but the parent div, #main, is fixed to a pixel width because your two columns inside of it are fixed pixel widths.

The truly ideal situation here would be to specify all of your layout's widths in em's instead of pixels. Then, if the users scales the font-sizes only, it also scales the layout. However, your background images won't support that. If you could forgo the shadows and use background colors instead, that might be a more flexible solution.