Css – font-family not working in Firefox, but works in all other browsers

cssfont family

I am using:
body {
font-family:"Franklin Gothic Demi";
}

It shows the font correctly in Chrome, Safari, and Internet Explorer, but shows Times New Roman in Firefox. Am I missing something? I thought Franklin Gothic Demi was a built in web font…

Best Answer

Try clearing the cache in Firefox.

Also consider embedding the fonts so that it is more compatible across all browsers and clients. http://www.google.com/webfonts

Some people discussed this exact problem. http://forums.madcapsoftware.com/viewtopic.php?f=9&t=15267

Related Solutions

Css – Targeting only Firefox with CSS

OK, I've found it. This is probably the cleanest and easiest solution out there and does not rely on JavaScript being turned on.

@-moz-document url-prefix() {
  h1 {
    color: red;
  }
}

<h1>This should be red in FF</h1>

It's based on yet another Mozilla specific CSS extension. There's a whole list for these CSS extensions right here: Mozilla CSS Extensions.

Html – Word-wrap in an HTML table

The following works for me in Internet Explorer. Note the addition of the table-layout:fixed CSS attribute

td {
  border: 1px solid;
}

<table style="table-layout: fixed; width: 100%">
  <tr>
    <td style="word-wrap: break-word">
      LongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongWord
    </td>
  </tr>
</table>

Best Answer

Related Solutions

Css – Targeting only Firefox with CSS

Html – Word-wrap in an HTML table

Related Topic