This problem has been driving me crazy for several weeks. I've seen similar issues here and here but not found answers to this. Sometimes my coworkers are unable to see icon fonts (generated by icomoon, by the way) on their IE9 even though I can. And now it seems to have switched - coworkers can see them and I can't. I powered up my laptop with IE8 natively installed and older versions of our site show the icons that won't show on my IE9 machine. The newer version of our site won't show icons on either.
I'm ready to write an IE9 stylesheet just removing icons fonts altogether, because for users who can't see the fonts, IE still puts that extra 15px~ of left padding that looks off.
IE8
IE9
Could it be a setting in the browser itself or what? Here's my CSS:
@media screen {
@font-face {
font-family: 'icons';
src:url('Media/fonts/icons.eot');
src:url('Media/fonts/icons.eot?#iefix') format('embedded-opentype'),
url('Media/fonts/icons.woff') format('woff'),
url('Media/fonts/icons.ttf') format('truetype'),
url('Media/fonts/icons.svg#icons') format('svg');
font-weight: normal;
font-style: normal;
}
[data-icon]:before {
font:normal normal normal 1em/0 'icons'; speak:none; text-transform:none;
-webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
[data-icon="search"]:before { content:"\e601"; }
[data-icon="downarrow"]:before { content:"\e602"; }
[data-icon="forms"]:before { content:"\e603"; }
[data-icon="contact"]:before { content:"\e604"; }
}