CODEWITHSUNDEEP
cssinternet-explorer
L. Cornelius Dol
L. Cornelius Dol

Reputation: 64066

IE Uses Courier Font when "font-family: monospace" is used

I have some (test) HTML like so:

<!DOCTYPE html>

<html lang="en">

<head>
  <title>Test Monospace</title>
  <style>
  tt { font-family: monospace; }
  </style>
</head>

<body>
  <h1>Test Monospace</h1>
  <p>This is normal text</p>
  <p><tt>This is monospaced text</tt></p>
</body>

</html>

When I display this in IE the monospace text uses Courier New instead of the font I have configured in IE. If I do nothing other than delete the <style>...</style> block, it correctly uses the configured font.

It only does this for IE, not FF or GC. IE 9 on Windows 7.

It does this regardless of where the style's configured, including a separate stylesheet or using a style attribute.

The real problem is that specifying the font-family and font-size is key to fixing the browser's problems with monospace text using the following styles:

/* monospaced sizes are horribly broken in browser default stylesheets */
code, kbd, pre, samp, tt {
    font-family     : monospace,monospace; /* Chrome   (but note that this makes IE use "Courier New" for some strange reason, as does plain monospace.) */
    font-size       : 1em;                 /* Firefox, IE,Opera */
    }

Does anyone know how to stop IE from doing this?

Upvotes: 1

Views: 20651

Answers (2)

gregory
gregory

Reputation: 1140

monospace is not a specific font familiy. Exactly like serif or sans-serif, which are generic family definitions.

font-family: monospace; just tells the browser to use the default "monospaced font", which in this case is Courier New. See also this resource.

EDIT:

If you omit the font-family rule for tt in your CSS, IE9 seems to display the custom set plain text font. Please see this fiddle: http://jsfiddle.net/sVCwd/1/

Hope this helps.

Upvotes: 4

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201798

It seems that in IE, monospace means Courier New. Changing the IE settings for “plain text font” affects the default font for some elements, like tt, but it does not change the meaning of monospace. In an old discussion someone who seems to know what he says writes: “(Please, no comments about the serif and monospace fonts which can be selected using Tools, Internet Options. They have nothing to do with the default CSS generic fonts.)”

If you want, as an IE user, to change the meaning of monospace, I suppose you would need to find an entry in Windows registry for it (I was unable to find it in Windows 7 – could not find IEFixedFontName for example).

But if you instead just want some elements rendered in a monospace font of your preference (which is mostly the same thing as far as practical effects are considered), you could set up a user style sheet with content like

code, kbd, pre, samp, tt, xmp, listing, plaintext {
    font-family: Consolas !important;
}

Upvotes: 2

Related Questions