Geek Answers Handbook

Font-face does not work in django

In django (local test project), I have a style.css file in a static folder that works fine, and the style applies to the template. static folder contains a folder with images and a folder with fonts. The contents of the image folder are displayed in the browser, but there are no fonts !!! here is my font-face code:

 font-family: '‌‌‌BMitra'; src: url('fonts/BMitra.eot?#') format('eot'), url('fonts/BMitra.ttf') format('truetype'), url('fonts/BMitra.woff') format('woff');

I check css firebug and find that my personal font is disabled and the browser uses tahoma instead:

 direction: rtl; color: #092E20; font-size: 24px; font-family: BMitra, Tahoma, Arial; text-align: right;

how do you use font in django?

+4
source share
3 answers

As you mentioned, the directory structure:

  • Static
    • CSS
      • my_css_file.css
    • fonts
      • font1
      • font2

Then in your my_css_file.css file you need to increase one folder to access the fonts:

 url('../fonts/BMitra.ttf')
+4
source

So, just in case someone is still facing this problem, I could not find the answer anywhere. Inside CSS, it will not work with relative paths, only through an absolute path, starting from a static folder, for example:

 src: url('/static/fonts/BMitra.eot?#') format('eot'),
+1
source

This may be due to a CORS problem. Do your fonts work with Chrome?

This can help:

http://html5hacks.com/blog/2012/11/18/configure-amazon-s3-for-cross-origin-resourse-sharing-to-host-a-web-font/

0
source

More articles:


All Articles