Fontface werkt op geen enkele manier

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Jop B

Jop B

05/12/2017 20:26:14
Quote Anchor link
Hallo,


Op een of andere manier wilt de font niet laden. Deze word aangeroepen door de @font-face regel.
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
@font-face {
      font-family:'iconjop';
    src:  url('../font/iconjop.eot');
      src:  url('../font/iconjop.eot#iefix') format('embedded-opentype'),
        url('../font/iconjop.ttf') format('truetype'),
        url('../font/iconjop.woff') format('woff'),
     url('../font/iconjop.svg#sociconregular') format('svg');
      font-weight: normal;
      font-style: normal;
}


De file staan een map erboven en dan in de map font.

Vervolgens wil ik de font gaan gebruiken

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "iconjop" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-Minicart{
    float: right;
    font-size: 32px;
    position: relative;
    top: 32px;
    right: 32px;
    width: 46px;
    height: 32.2px;
}

.icon-Minicart:before {
      content: "\e900";
      color: #006dd3;
}


Helaas weergeeft de browser geen icoontjes:(

Kan iets dit tegen houden op een of andere manier?
Gewijzigd op 05/12/2017 20:31:41 door Jop B
 
PHP hulp

PHP hulp

25/04/2024 13:31:22
 
Jan Koehoorn

Jan Koehoorn

05/12/2017 20:30:22
Quote Anchor link
Er mist een [ aan het begin van je CSS.
 
Jop B

Jop B

05/12/2017 20:32:25
Quote Anchor link
Beste Jan,

Thanks voor de reactie, excuses dat was een typefout met het invoeren van het topic. Deze staat wel in de css.
 
Jan Koehoorn

Jan Koehoorn

05/12/2017 20:58:27
Quote Anchor link
In dat geval zou ik eens wat verschillende settings voor dat relatieve pad uitproberen. Staan de fontbestanden wel op de goede plek?

Probeer eens een absoluut pad vanaf je webroot (dus beginnen met /)

Nog een tip: kijk eens of een andere css selector wél werkt, dus bijv gewoon een h1 of een p.

Andere tip, probeer die CSS selectors eens te scheiden? De eerste is waarschijnlijk overbodig, want de tweede selecteert sowieso alles wat die class bevat. (Misschien nog even kijken wat er gebeurt als je die spatie weghaalt)
Gewijzigd op 05/12/2017 20:58:46 door Jan Koehoorn
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.