Questions tagged [font-face]

@font-face is a CSS rule that allows the definition of embedded fonts within a webpage.

Initially proposed in CSS2 (and supported in IE 5 using the EOT font format), and subsequently removed from CSS2.1, @font-face was re-introduced as a CSS3 module. Different browsers require different font formats to work, and the license of the font itself needs to permit its use with the @font-face rule.

3439 questions
1
vote
1 answer

Issue with font (special characters) not showing correctly on webpage

So I have a small issue with typography on a website (made with Wordpress). It works fine on all pages and all browsers, except one page on safari that just won't show nicely. Normal characters have the right font but the special ones (éèà ..) use a…
L. G.
  • 35
  • 10
1
vote
2 answers

Cannot load font files, 404 error

I am using two font icons in a project. Font Awesome and a customize SVG font. All font files are in same folder. Here is the file structure: -assets -css -font-awesome.min.css -themefy.css -fonts -font-awesome.eot …
smartrahat
  • 5,381
  • 6
  • 47
  • 68
1
vote
1 answer

Font awesome not working on ANY iE or Edge

I am having an issue with Font awesome icons and it's iE support. It is working perfectly fine on all other browsers. But for some reason on iE or Edge, the icon doesn't appear, There is a space of where it would go, yet there is no icon. I noticed…
Zlerp
  • 467
  • 7
  • 16
1
vote
1 answer

Relative path not working with a custom font

I have an issue trying to call my custom font with a relative path when my code is in production. Everything works fine on my local setup. Here is my folder…
Jean-Baptiste
  • 1,552
  • 1
  • 19
  • 33
1
vote
0 answers

@font-face doesn't work with full path

This is NOT a duplicate of Font-Face use absolute path. In folder1, I have index.html, main.css and digital.tff. I don't understand why the font doesn't work with the full path. I tested wood-table.jpg with and without the full path and it works…
AlwaysLearning
  • 311
  • 4
  • 12
1
vote
0 answers

will all font types in @font-face be downloaded?

Wondering if I include various font formats within @font-face in CSS, all of them will be downloaded no matter whether they will be used in the browser, or only the one that is used in the browser will be download? @font-face { font-family:…
Nima
  • 2,100
  • 2
  • 23
  • 32
1
vote
1 answer

Letter spacing doubles for font-face fonts on iPhone

I used fontsquirrel to download webfonts but the letter spacing doubles on the iPhone. I tried enabling "remove kerning" in the fontsquirrel settings but that doesn't work. @font-face { font-family: 'fjalla_oneregular'; src:…
user300979
  • 389
  • 1
  • 4
  • 18
1
vote
1 answer

Are there any way to use custom font file in my site?

I can use @font-face but it does not work in all browsers. Are there any way to use custom font file in my site ?
faressoft
  • 19,053
  • 44
  • 104
  • 146
1
vote
1 answer

IE8 - Font anti-alias strange behaviour (w/ prints. example)

As every web-developer I'm tired of Internet Explorer... I'm working on a new website and use font-face (the problem may not be related but just in case...): @font-face { font-family: 'ArabicTypesettingRegular'; src:…
1
vote
1 answer

@font-face not working only in Chrome Browser

I'm having trouble getting a font to display in Google Chrome (Version 51.0.2704.106 (64-bit)) Safari and Firefox work fine. Here is the code I am using as an example. @font-face { font-family: 'MyWebFont'; src: url('webfont.eot'); /* IE9…
SamYoungNY
  • 6,444
  • 6
  • 26
  • 43
1
vote
1 answer

webfonts: @font-face should include font-style and font-weight?

When including a @font-face and src to import a webfont, I notice you can pass in 2 optional values. I am not doing that presently. I have 2 Web-fonts, Lato Regular and Lato Bold. Should I be specifying weight in the @font-face rule? It says by…
Martin
  • 23,844
  • 55
  • 201
  • 327
1
vote
2 answers

Firefox won't render fonts

So firefox doesn't want to load my fonts, the path is right I also so the request in Firebug, but it won't render it. On other browser it works perfect, here is my code: @font-face { font-family: 'Gill Sans'; src:…
Uffo
  • 9,628
  • 24
  • 90
  • 154
1
vote
2 answers

Inline heading with background color using @font-face - not working on Mac in either Safari or FF

I have an inline heading (h1) with a background-color on the heading, but on Mac OS in both safari and Firefox it does not seem to stretch around the font. With a websafe font it works fine. Line height is set according to the font-size. Any…
1
vote
0 answers

Weird font issue in chrome: two dots (Umlaut) above letter

I am facing a weird problem with my font. This has happened when I apply the bold version of AkzidenzGroteskBE font. What's wrong with it? Thanks in advance.
1
vote
2 answers

Web font doesn't show some letters

I have a huge problem with webfonts, specifically - Pluto Sanslight, Pluto Sansbold and Pluto Sans Regular. When I install .ttf file in computer, I can write in Lithuanian letters (ą, č, ę, ė, į, š, ų, ū, ž) and everything seems perfect, but when I…
Paulius Vitkus
  • 129
  • 1
  • 4
  • 15