Questions tagged [webfonts]

Technology that enables people to use fonts on demand over the Web without requiring installation in the operating system.

What are WebFonts?

WebFonts are a technology that enable people to use fonts on demand over the Web without requiring installation in the operating system. The W3C working group has introduced webfonts as part of the CSS 2 specification, and addendums are included in CSS 3. Until recently, downloadable fonts have not been common on the Web due to the lack of an interoperable font format. Modern browsers support the now widely used format (and woff2 for better compression). In the past other formats like eot (initial proprietary Microsoft), ttf (uncompressed) or svg were used.

Links

1549 questions
67
votes
11 answers

How to make Google Fonts work in IE?

I've been developing a site that uses the Google Fonts API. It's great, and supposedly has been tested in IE, but when testing in IE 8 the fonts simply don't get styled. I included the font, as Google instructs, thus:
Isaac Lubow
  • 3,557
  • 5
  • 37
  • 53
54
votes
8 answers

Japanese standard web fonts

I am working on a japanese website and have a hard time finding a font which looks good in japanese. I was surprised that so few fonts seem to exist for japanese. My team has contacted several web font providers without much success. Only one…
Mattias Örtenblad
  • 636
  • 1
  • 6
  • 10
44
votes
3 answers

Packaging a font with a Google Chrome extension

I want to use something other than the standard fonts with my Chrome extension. I was excited about the possibility of using the Google Web Fonts, but it seems that could incur a penalty for transferring the web font over the network whenever your…
user2852001
  • 441
  • 1
  • 4
  • 3
43
votes
8 answers

Font weight ignored in Chrome

I created a fiddle trying to use Open Sans font with font-weight 300: HTML example CSS .demo { font-weight: 400 !important; font-family: 'Open Sans' !important; font-style: normal; font-variant: normal; } I use…
vseguip
  • 509
  • 1
  • 6
  • 11
40
votes
3 answers

How do you view EOT webfont files?

With so many people using EOT files for webfonts (to support IE8) I can't believe I am unable to find a single application that supports viewing them. Hopefully I'm missing something obvious but when I Google "eot file viewer" I find nothing but a…
eselk
  • 6,764
  • 7
  • 60
  • 93
39
votes
2 answers

How do I use fontello fonts?

According to one source, this is how I use Fontello fonts: Now it's trivial to make a custom icon webfont, exactly for your needs. First, select the icons you like. Then update glyph codes (optional), and download your webfont bundle. Fontello…
Nancy Collier
  • 1,469
  • 4
  • 17
  • 21
37
votes
6 answers

Fix custom font line-height with CSS

I've been experiencing a strange issue when using a custom font on a new webapp i'm working on. This custom font (FF DIN) Seem to have naturally vertical off-center line-height, which force me to put some padding-top hack to compensate the top space…
kirkas
  • 1,749
  • 2
  • 12
  • 22
37
votes
7 answers

Icon fonts not loading in IE11

We're using icomoon for our icon fonts, and they work fine in Chrome and Firefox, but won't display in IE11... Sometimes. It seems to work on the first page load, but not on subsequent page loads. Clearing the cache doesn't seem to reset it. This…
Theron Luhn
  • 3,974
  • 4
  • 37
  • 49
36
votes
12 answers

Showing on console: Slow network is detected. Fallback font will be used while loading

what can I do in this case? I'm seeing this on my console when ran on the browser the AngularJS App: Slow network is detected. Fallback font will be used while loading: /bootstrap/dist/fonts/glyphicons-halflings-regular.woff2 I also see the fonts…
Scopi
  • 663
  • 1
  • 6
  • 21
36
votes
6 answers

How to download multiple formats of a web font from the (official) Google Web Fonts repo?

I've learnt that Google automatically serves TTF, EOT, WOFF, or SVG font files depending on the browser / device it's accessed from. Now I am planning to host and serve the font files from my server itself, for which I would first have to download…
its_me
  • 10,998
  • 25
  • 82
  • 130
33
votes
6 answers

How can I fix the 'Missing Cross-Origin Resource Sharing (CORS) Response Header' webfont issue?

For some reason fonts have stopped rendering on my sites. The fonts are stored locally, on the same server as the site. I looked up the problem and it seems to be a Missing Cross-Origin Resource Sharing (CORS) Response Header but I cannot understand…
MeltingDog
  • 14,310
  • 43
  • 165
  • 295
32
votes
2 answers

What is the status of TTF support in Internet Explorer?

I'm trying to determine the status of support for the TTF font format on Internet Explorer. (I don't have any Windows machines on hand to try it with.) The table at caniuse states that IE from version 9 onwards supports TTF but "only working when…
JC Hulce
  • 1,551
  • 2
  • 13
  • 23
30
votes
2 answers

How can I only use Latin subset with Google Fonts WOFF2 files?

I wanted to add a font with Google Fonts, and I have noticed an odd behavior. I want to add a font with only the latin subset, I do not want latin-ext, cyrillic or cyrillic-ext subset, in order to lighten the code. I understand that's the default…
webdif
  • 6,341
  • 3
  • 18
  • 15
29
votes
3 answers

Which monospace font does a browser use?

With CSS, if you specify font-family: monospace;, my understanding is that the browser chooses its default/preferred monospaced font. If that's correct, how can you determine which monospaced font your browser is using?
nickh
  • 4,721
  • 2
  • 29
  • 31
27
votes
3 answers

Google fonts in React Native

I was wondering if it'd be possible to use Google fonts in my React Native project. I've been looking for some information but I didn't find anything. Is it possible? Thanks. P.D.: I know I can download it and include it into my project.
JV Lobo
  • 5,526
  • 8
  • 34
  • 55