0

We have a custom font, and we're using MSM, but I can only get the font to work on the main site.

here's the css:

@font-face {
    font-family: 'customfont';
    src: url('/fonts/customfont.ttf');
}

I've tried copying the font to a 'fonts' folder under each site directory, but that didn't help.

2 Answers 2

1

Load one of your sites. You can use the developer console in any modern web browser (Chrome or Firefox are best) to check the following (hit F12, and use the magnifying glass or investigate tool to look at a part of the DOM that should have that font, like a

<p> This should be in that font </p>

tag):

Is the CSS rule showing up on the Elements tabs style sub-tab?? If so, is there another CSS rule over riding it?

If the rule is definitely loaded, with the developer console open, go to the Network tab and reload your site. In this tab, you should look for your file 'customfont.ttf' and see what the Status code is. You're looking for 200 or 304 to verify the font was loaded.

10
  • Yup, the rule is loaded, so I tried Chrome, to check the Network tab, and in Chrome it works on all sites! But in FF it only works for the main site. I've tried ctl+f5
    – wot
    Mar 27, 2015 at 16:37
  • Clear your browser cache on FF! There's also an extremely tiny chance that Chrome and FF are loading two font face rules in different order of inheritance, but I really doubt that.
    – jrothafer
    Mar 27, 2015 at 16:40
  • I tried clearing my cache, it didn't help. But, in a FF developer window, I scrolled down to the css rule that assigns the font to the selected text, and disabled it, and the font gets assigned! I checked, there is no other rule for te font.
    – wot
    Mar 27, 2015 at 16:48
  • Try adding !important to the end of your font rule, remember that fonts are inherited by parent elements. This sounds like a CSS issue, through and through.
    – jrothafer
    Mar 27, 2015 at 16:52
  • I was mistaken, disabling the font loads a similar font instead, not the exact one. adding !important didn't help.
    – wot
    Mar 27, 2015 at 16:54
0

Try a full path - src: url('http://mysite.something/fonts/customfont.ttf');

1
  • Thanks but I've tried that!
    – wot
    Mar 27, 2015 at 15:55

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.