.eot not working in IE

Question

I'm importing a font with CSS. However, it does not seem to work in IE. I don't know why.

Here's my CSS code:

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

    font-weight: normal;
    font-style: normal;
              }
.bello { 
    font-family: "bello", Verdana, Tahoma;
}

I've added .eot, .svg, .woff, .ttf and .otf to the folder fonts. It displays correctly in all browsers except IE. To create the .eot file I used this site: http://www.kirsle.net/wizards/ttf2eot.cgi.

I have no idea why it's not working. Any help would be great. Thanks!

Solution

solved the problem, it was not problem of the eot file. It seems IE has a problem finding the .eot file if the family name is different as the full name of the font. In my case font name was bello-script and font family was bello. Changed both of them and everything worked fine.

Comments

[Tom]

You, sir, are a mighty GENIUS. Been trying to solve this problem for ages

[Simon Green]

Could you describe what you mean by "full name of the font"? Where is this specified? You say that you had set your font name to "bello-script", but I don't see that mentioned anywhere in your code snippet...

[Z.T]

@SimonGreen when you create a font, in the .svg file there are details of the font, under which the fullname is also a field, like the following: <json> <![CDATA[ { "fontFamily": "bello", "majorVersion": 1, "minorVersion": 0, "version": "Version 1.0", "fontId": "hillrom", "psName": "hillrom", "subFamily": "Regular", "fullName": "bello-script", "description": "Font generated by IcoMoon." } ]]> </json>