Firefox fails to render mono spaced font correctly

Question

OK, here's my problem I thought that using Google Webfonts would take care of all the cross Browser mess for me, well guess what, I was wrong.

It turns out that Firefox does not like Droid Sans Mono. In particular, it renders bold glyphs WIDER than the non bold ones, which turns out to be very unhandy when you're creating a terminal based hacking game in JS.

You can take a look at it here, wait a few seconds for the boot sequence to pass by, then look at the status line at the top:
http://dl.dropbox.com/u/2332843/os/os.html

Well, so now I'm in search of either a way to make Firefox render the whole thing correctly, or a good alternative to Droid Sans Mono.

Answer 1

Ideally, you need a font which has its own bold variant. Bold faces are often synthesized by user agents for faces that lack actual bold faces. See:

http://www.w3.org/TR/css3-fonts/#font-weight-the-font-weight-property

One such monospaced font is DejaVu Sans Mono. This font has normal, bold and italic variants which render characters at the same width. It is legible at a font size of 10px.