0

I am doing :

<div class="testing"
    style="font-family:  Carrington,'Black Rose', Champagne, 'England Hand'">testing</div>

All these families are embedded using @font-face. While Chrome on Windows and Linux loads all the font families mentioned in the fallback(checked via the network load option in the console), it does not do so on the Android tablet(this was checked as I created further divs after this one with font families Black Rose and witness the FOUT issue on chrome).

Is this the universal behaviour of Chrome on Android that it will load only the first family found and neglect the others?

Bhumi Singhal
  • 8,063
  • 10
  • 50
  • 76

2 Answers2

0

The reason it only loads the first font-family found is because it found it.

The reason you would add more fonts to the font family is for the "just in case" possibility that the preferred font is not found. That is why most font-familys look like:

font-family: 'Trebuchet MS', Verdana, Arial, sans-serif;

Browser Interpretation:

If the computer browser doesn't have the "Trebuchet MS" font then load Verdana. If it doesn't have Verdana then load Arial. If for some odd reason Arial isn't a choice then load the default sans-serif font.

ZombieCode
  • 1,646
  • 2
  • 24
  • 46
  • Yeah I get the concept that technically only the first family that is found must be loaded but the question remains that why does Chrome on Windows/Linux loads all the other families as well even though it found the first family? – Bhumi Singhal Feb 01 '13 at 08:57
  • Is it that is trying to save up the cache space or something on devices?? – Bhumi Singhal Feb 01 '13 at 08:59
  • Well, change your font-family on one of your
    tags to have your second choice be your first choice ('Black Rose') and see what happens. I suspect it will load up that font you requested. Then perhaps it is a cache space issue. Sounds good at least.
     – ZombieCode Feb 01 '13 at 14:40
0

What is really bizarre about this is not the way the font family functions. I think most people understand how that works.

What's really weird is when you are using a common system font like trebuchet ms that IS on the system, but the browser can't find it.

I've had this problem with Trebuchet. For some inexplicable reason, on my Android phone, my regular browser has no trouble with it, but Chrome can't do it.

The font is there. But Chrome can't see it.

JimmyDee
  • 1
  • 1