Icomoon font generator: Failed to decode downloaded font - html

Question

I have some icon fonts being used from https://icomoon.io/app/#/select
When I use the generated CSS it works fine from style tags on the actual HTML page:
<style>
#font-face {
font-family: 'icomoon';
src: url('fonts/icomoon.eot?hsw0h3');
src: url('fonts/icomoon.eot?hsw0h3#iefix') format('embedded-opentype'),
url('fonts/icomoon.ttf?hsw0h3') format('truetype'),
url('fonts/icomoon.woff?hsw0h3') format('woff'),
url('fonts/icomoon.svg?hsw0h3#icomoon') format('svg');
font-weight: normal;
font-style: normal;
}
</style>
When I put the CSS in my CSS file and adjust the paths:
#font-face {
font-family: 'icomoon';
font-style: normal;
font-weight: normal;
src: url('../fonts/icomoon.eot?hsw0h3#iefix') format('embedded-opentype'), url('../fonts/icomoon.ttf?hsw0h3') format('truetype'), url('../fonts/icomoon.woff?hsw0h3') format('woff'), url('../fonts/icomoon.svg?hsw0h3#icomoon') format('svg');
src: url('../fonts/icomoon.eot?hsw0h3');
}
I am getting this error in the developer console:
Failed to decode downloaded font: file:///C:/Users/Daisy/Desktop/softstack%20consulting/fonts/icomoon.eot?hsw0h3
OTS parsing error: invalid version tag
I dont understand why it fails to decode the font just by moving the CSS and changing it's path. What am I doing wrong and how do I fix it?

Answer 1

You're overriding the src with this line:
src: url('../fonts/icomoon.eot?hsw0h3');
Look more closely at the original CSS. Those different formats separated with comma should be part of the second src value, not the first one.