View Full Version : @font-face not recognized

02-19-2012, 08:01 PM
Ok I have my site up so far but the two fonts I used are not showing up. I transferred the fonts and put them in the same folder as my webpages. I also used @font-face in css (styless.css). I'm not sure where I went wrong.

Website: http://envycosmetics.zxq.net/TestSite/webpages/index.html

02-19-2012, 08:24 PM
Your font-face declaration within styless.css is

@font-face {
font-family: abeatbyKai;
src: url('abeatbyKaiRegular.otf');

@font-face {
font-family: OptimusPrincepsSemiBold;
src: url('OptimusPrincepsSemiBold.ttf');

which suggests the font files should be in the same directory as the css file, not the webpages. Also, I'd expect for this to work cross-browser you'll need more than those font files. Try FontSquirrel (http://www.fontsquirrel.com/) for more help with generating the right @font-face files.

02-19-2012, 08:42 PM
wow haha silly mistake, thanks tho! With this Font Squirrel, how does it work. The font I used isn't on the site.

02-19-2012, 11:00 PM
Go to the font face generator and upload your font file(s) – provided they are legal to be embedded with CSS this way. It will also generate all file formats and CSS for you for cross-browser compatibility.