Rule @face font

[Gema]

Hello:

I´m new member. I need help whith rule @face font. It place on CSS but It does not work. I use current explorer Moxila.

 

Does alquien know the reason of that does not work?

thanks in advance

[tejasamrute]

well....we need to see your code before telling where are you going wrong

 

and do you also have your desired font in eot,woff,ttf extension?

[Gema]

Hello:

The code is

@font-face{ font-family:"Avenir-n"; src:url('fonts/AEBL.ttf') ;}@font-face{ font-family:"Avenir"; src:url('fonts/AEM.ttf');}

I have folder name fonts with AEBL.ttf y AEM.ttf

 

thank

[tejasamrute]

@font-face {  font-family: 'AEBL';  src: url('fonts/AEBL.eot');   src: url('fonts/AEBL.eot?#iefix') format('embedded-opentype'),        url('fonts/AEBL.woff') format('woff'),        url('fonts/AEBL.ttf')  format('truetype'), }div {font-family: 'AEBL';}

you need 3 types of font extension to make it work on all browsers (TTF, EOT, WOFF).....u only have ttf

 

btw...i am not able to find AEBL font....are you sure it is not Abel font

Edited February 11, 2015 by Tezzo

[Ingolme]

Just for testing, TTF alone will work for all recent version of browsers. See compatibility table here: http://www.w3schools.com/cssref/css3_pr_font-face_rule.asp

 

I suspect it wasn't working because he forgot to assign it to an element.

body {    font-family: Avenir;}

[tejasamrute]

@ingolme.... i tried to look for AEBL font......google doesn't even show in its suggestions....i am guessing he might have assigned wrong name

 

@Gema.....right click on your font....select preview....you will see the name of the font

[Ingolme]

@ingolme.... i tried to look for AEBL font......google doesn't even show in its suggestions....i am guessing he might have assigned wrong name

 

@Gema.....right click on your font....select preview....you will see the name of the font

 

I assume this is the font he's using: http://www.fonts.com/font/linotype/avenir

 

The filename doesn't necessarily have to match the font name.

[tejasamrute]

i have been through that problem or call it a bug....but whatever it is......just to be safe.....i rename the file to its actual name

[Gema]

Hello:

It wanted to answer to several members who have wanted to help me

I tape-worm understood that with the typography ttf tape-worm that to work in all the current explorer.

I don´t forgot to assign it to an element.

And the filename doesn't necessarily have to match the font name.

This where my mistake?

[dzhax]

@font-face{   font-family:"Avenir-n;   src: url('fonts/AEBL.ttf');}@font-face{ font-family:"Avenir;src: url('fonts/AEM.ttf');}

That should work assuming your font files are not messed up. To be safe with browser compatibility, I normally use a service such as FontSquirrel to convert my fonts. Then I use css like Tezzo's first post and I have never had issues with it.

Edited February 16, 2015 by dzhax