@font-face works in IE8 but not IE9

by

No answer, just confirmation: I have a similar kind of problem. Font works in all other IE versions except IE9, both using IETester and original browser. When changing Document Mode (F12 dev tools) font works. Not how I’d like it though.

Update: With some trickery I managed to get it working. Seems like IE9 is using the .woff version of the font (which I had excluded) over the .eot that I thought it would. I used the @font-face generator from fontsquirrel to get all the different font variations and included them in my project, using the smileyface-local. Did not have to alter my .htaccess file. Now works fine and looks the same in all IE versions:

@font-face {
  font-family: "LucidaFax-bold";
  src: url("_font/LucidaFax-bold.eot");
  src: local("☺"),
  url("_font/LucidaFax-bold.woff") format("woff"),
  url("_font/LucidaFax-bold.ttf") format("truetype"),
  url("_font/LucidaFax-bold.svg#LucidaFax-bold") format("svg");
  }

h1 { font-family: "LucidaFax-bold", serif;}

(I even got mad fresh using Mark “Tarquin” Wilton-Jones’ text-shadow hack, applying same look to IE versions as rest of the browser world. Old school? Looks great! Was it worth it? Well, learned a lot. 😉

More Related Contents:

  1. @font-face EOT not loading over HTTPS
  2. Internet Explorer @font-face is failing
  3. On IE CSS font-face works only when navigating through inner links
  4. Text in a flex container doesn’t wrap in IE11
  5. Using custom fonts using CSS?
  6. CSS rotate property in IE
  7. Are eot, ttf, and svg still necessary in the font-face declaration?
  8. CSS @font-face not working with Firefox, but working with Chrome and IE
  9. Internet Explorer’s CSS rules limits
  10. Wait for fonts to load before rendering web page
  11. IE display: table-cell child ignores height: 100%
  12. IE 6 & IE 7 Z-Index Problem
  13. @font-face anti-aliasing on windows and mac
  14. How does one target IE7 and IE8 with valid CSS?
  15. z-index does not work in Internet Explorer with pdf in iframe
  16. CSS @font-face – what does “src: local(‘☺’)” mean?
  17. CSS Selector for
  18. Any way to remove IEs black border around submit button in active forms?
  19. Google warning: Resource interpreted as Font but transferred with MIME type application/octet-stream
  20. element not working in Internet Explorer 11
  21. Icon fonts not loading in IE11
  22. Detecting IE version using CSS Capability/Feature Detection
  23. Non-Standard fonts in web?
  24. Does Internet Explorer support CSS transitions?
  25. @font-face not working with specific version of Internet Explorer 11
  26. CSS3 3D Transform doesn’t work on IE11
  27. IE not rendering CSS properly when the site is located at networkdrive
  28. Using @font-face with Rails 3.1 app?
  29. How to fix Internet explorer 7 bug when using percentage widths for layout?
  30. Downloadable font on firefox: bad URI or cross-site access not allowed

Leave a Comment