Set font-family: "Monospace" renders as serif

[onebree]

Challenge: http://www.freecodecamp.com/challenges/waypoint-set-the-font-family-of-an-element

Just for reference, I am using Firefox 38 and Windows 8.1, without additional fonts or MS Office installed. As such, the font Monospace does not render in the exercise. Instead, it produces Serif. Interestingly enough, the dev tools show the correct font family. (See attached screenshot)

In my Firefox settings, I have the default monospace font as "Lucida Console", so I am not sure why that font is not displaying, in place of "Monospace"

[ahstro]

Which version of Firefox are you running? Have you tried just refreshing the page? I've seen a lot of issues caused by the browser that got "blamed" on FCC itself.

[vishalarora]

@onebree That's likely because you have the font-family surrounded in quotes. Monospace isn't an actual font-family, it's a keyword that represents the browser's default monospaced font (as you point out, Lucida Console in your case).

When you surround the font-family value in quotes, the browser is attempting to load a font actually called "Monospace" and failing since that doesn't exist on your system.

Try the following code and see if it's fixed:

p {
 font-size: 16px;
 font-family: monospace;
}

[onebree]

@vishalarora The instructions are as follows:

Make all of your p elements use the "Monospace" font.
You can set an element's font by using the "font-family" attribute.
For example, if you wanted to set your h2 element's font to "Sans-serif", you would use the following CSS: h2 { font-family: 'Sans-serif'; }

Maybe, the lesson should be changed to ask for the family monospace? Beause I see family as a type (monospace, sans-serif, etc), or a group of fonts ("Sans-Serif, Arial, Helvetica")

EDIT: Your suggestion of changing to the type monospace worked. It renders as the default monospace set by my browser

[onebree]

UPDATE - I am noticing that when you begin a new exercise, the code changes slightly to show best practices and ideal answer. This is what FCC considered to be correct:

<style>
  p {
    font-size: 16px;
    font-family: Monospace;
  }
</style>

Notice the capitalized "Monospace", without quotes. In my opinion, when FCC refers to a phrase to enter, it should wrap it in a code tag, as I assumed the quotation marks to be included.

[QuincyLarson]

The issue seems to be that I originally put the example in quotes. I'm going to fix that. Thanks for catching this, @onebree.

[onebree]

Thank you for such a quick response!