The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS fonts for IE9

  • This topic is empty.
Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
  • #204045


    Im using the current code in my css file.

    @font-face {
        font-family: 'Helvetica Neue';
        src: url('font/HelveticaNeue_Lt.ttf');
        font-weight: normal;
        font-style: normal;

    But Helvetica does not display properly in IE9and below.

    Im not using a different css file for IE9. Is it possible to change/add some code in the same css file so that for IE9 and below i can display myriad-web-pro.ttf instead of helveticaNeue




    This is the new code that i have added. Helvetica still does not show upon IE9. Infact no text displays.

    Is there i way i can display simple arial if the browser is IE9.


    I believe so, you can write it in the CSS like this :

    #element {
    font-family: 'Helvetica Neue', Arial;

    If that doesn’t get the desired result, another option would be to write a conditional statement.


    @font-face {
    font-family: ‘Helvetica Neue’;
    src: url(‘font/Helvetica/HelveticaNeue_Lt.ttf’); /* IE9 Compat Modes /
    src: url(‘font/Helvetica/HelveticaNeue_Lt.eot?#iefix’) format(’embedded-opentype’), /
    IE6-IE8 /
    url(‘font/Helvetica/HelveticaNeue_Lt.woff’) format(‘woff’), /
    Pretty Modern Browsers /
    url(‘font/Helvetica/HelveticaNeue_Lt.eot’) format(‘truetype’), /
    Safari, Android, iOS /
    url(‘font/Helvetica/HelveticaNeue_Lt.svg#svgFontName’) format(‘svg’); /
    Legacy iOS */
    font-weight: normal;
    font-style: normal;

    but still doesnt work


    there was some error in my pasting the code. The astrieks are present and my code, looks exactly like urs. but it still doesnt work. I also have the font files int he right folder. Apparently theres in some problem in IE displaying fonts of Type1.

    Heres the link.


    i also tried the following

    Created a new css for IE-9

    added the following code in the html file

    <!DOCTYPE html>
    <!--[if IE 7]><html lang="en" class="ie7"><![endif]-->
    <!--[if IE 8]><html lang="en" class="ie8"><![endif]-->
    <!--[if IE 9]>
        <html lang="en" class="ie9">
        <link rel="stylesheet" type="text/css" href="css/style-ie9.css" />
        <link rel="stylesheet" type="text/css" href="css/header1-ie9.css" />
    <!--[if gt IE 9]><!-->
    <html lang="en"><!--<![endif]-->
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <!--CSS Global Compulsory-->
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="css/header1.css">
    <link rel="stylesheet" href="css/bootstrap-responsive.min.css">
    <link rel="stylesheet" href="css/style_responsive.css">
    <link rel="shortcut icon" href="images/favicon.ico">

    the normal css file has the following code

    @font-face {
      font-family: 'Helvetica Neue';
      src: url('font/Helvetica/HelveticaNeue_Lt.ttf'); /* IE9 Compat Modes */
      src: url('font/Helvetica/HelveticaNeue_Lt.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
           url('font/Helvetica/HelveticaNeue_Lt.woff') format('woff'), /* Pretty Modern Browsers */
           url('font/Helvetica/HelveticaNeue_Lt.eot')  format('truetype'), /* Safari, Android, iOS */
           url('font/Helvetica/HelveticaNeue_Lt.svg#svgFontName') format('svg'); /* Legacy iOS */
               font-weight: normal;
        font-style: normal;
        font-family:'Helvetica Neue',sans-serif;

    the ie css file does not have any helvetica font code. Instead the elements on the file have the following:

        font-family: Arial,sans-serif;

    Should this work properly.


    Not sure what’s going on exactly (have the other font formats been added to the directory for example?) but the IE specific stylesheet would have to be placed after the general one or it’ll be overruled.

    A .woff font should work fine in IE9 by the way…

    Personally, I leave it like that (a woff file only) and use a web safe fallback for the rest.

Viewing 7 posts - 1 through 7 (of 7 total)
  • The forum ‘CSS’ is closed to new topics and replies.