In this case everything works well and font displayed right:
@font-face {
font-family: 'CalibriRegular';
src: url('fonts/calibri.eot');
}
But when I add other formats, font is not displayed in IE8:
@font-face {
font-family: 'CalibriRegular';
src: url('fonts/calibri.eot');
src: url('fonts/calibri.eot') format('embedded-opentype'),
url('fonts/calibri.woff') format('woff'),
url('fonts/calibri.ttf') format('truetype'),
url('fonts/calibri.svg#CalibriRegular') format('svg');
}
What's the problem? Thanks
You need a hash, usually ?#iefix
for convention, on the eot that appears in the multiple src list.
This explains why:
How does ?#iefix solve web fonts loading in IE6-IE8?
@font-face {
font-family: 'CalibriRegular';
src: url('fonts/calibri.eot');
src: url('fonts/calibri.eot?#iefix') format('embedded-opentype'),
url('fonts/calibri.woff') format('woff'),
url('fonts/calibri.ttf') format('truetype'),
url('fonts/calibri.svg#CalibriRegular') format('svg');
}