CSS and smaller text

[richy]

We have designed a site and everything seems ok, unless the user has smaller fonts set on their browsers.

We currently have the normal text set as font-size: 0.8em; and when the user has smaller text set (View->Text Size->Smaller) then the text is unreadable. Apart from making all the text bigger, is there a work around this?

[ober0330]

Don't worry about it? If their text size is that small, it becomes their problem if they can't read it. And honestly, you are probably only singleing out 2% of your viewers.

Also, I don't know if it makes a difference, but I use the "pt" notation instead of "em" and it shows up the same no matter what size the user has the text set to. Maybe that is your solution.

[CornedBee]

Only on IE (and it's usually considered a bug there by most developers), all other browsers scale all fonts.

But I agree, if the user has small fonts set and the text becomes unreadable, that's their problem.

[mendhak]

If you specify the font size using px, then the text cannot be scaled in IE. (Correct me if I'm wrong)

In FireFox though, you can enlarge the text so that it looks like you're being attacked by mutant disgruntled alphabets from another planet.

:eek:

[CornedBee]

That's correct. Every browser but IE applies text zoom to all text, while IE doesn't apply it to text specified in px, pt, and I think real-world units like mm (if they're even valid). IE applies it only to em, ex, % and keywords like small.
Opera applies the zoom even to images, which no other browser does.

[richy]

I modified the CSS to use the keywords like small, smaller etc and that seemed to do the trick.

Thanks everyone for your help. Its one of those things I never even thought about checking. At least I found out SkySports.com have the same problem so its not just me!