I'm having a problem with my icon fonts. It works with any other browsers but not with IE8. Already tried bulletproof solutions but without success. The problem is with IE8.. when page is loading, I can see icons, but when page is fully loaded ( progress bar ) my icons disappear.
I'm using external links for my icons files, but I don't think that's the problem. You can see a test page: www.maky.nazwa.pl/new
Does anyone know what's causing this madness?
BTW. Generated by IcoMoon.io
for all who will try to find the answer... this line fixed my problems..
<link id="base-css" rel="stylesheet" href="style.css?family=icomoon" />
style.css?family=nameOfFont
Related
is there any general reason for which Font Awesome doesn't show up in IE 10?
Another question - what's the #font-face thing all about? Do I have to use it? I haven't done it so far and it works well in Firefox and Chrome, could that be the reason for IE?
(excuse my ignorance, I'm a complete newbie)
I had the same issue, the actual cause was https secured connection
I was using https protocol changed it to http
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
I Hope it helps
If it is working on other browsers, make sure you are not in compatibility mode or have not accidentally put your site on the compatibility list in IE.
If it doesn't work in others, it has to have 2 classes: fa AND fa-blah (assuming Font Awesome 4.x; Font Awesome 3.x has different notation)
Also, check your developer tools F12 to make sure all the fonts and CSS/JS is loading into the site.
I use Unsemantic for the first time, and I forgot to check my page on IE8. Here is the disaster : http://canapin.com/web/meteo/
Unsemantic is supposed to be IE8 compatible, but my page is messed up, and I can't figure out why.
Any idea? :(
As stated in its issue tracker, since IE8 doesn't support media queries, Unsemantic grid offers a fixed-width layout for it, through a separate css file inclusion:
<!--[if (lt IE 9) & (!IEMobile)]>
<link rel="stylesheet" href="./stylesheets/ie.css?1389034275" />
<![endif]-->
Note the conditional comment avoiding the separate css for mobile versions of IE (they are supposed to support media queries):
I suppose you can download the source of the separate css from here:
http://unsemantic.com/stylesheets/ie.css
So, if you accept to have an IE8 with fixed-width layout (and it seems very reasonable to me), you don't need a javascript fix ;)
Bye bye!
for IE8 and lower you have to include a shim, which comes with the Unsemantic files.
Include the following code in your head and you should be fine:
<!--[if lt IE 9]>
<script src="./assets/javascripts/html5.js"></script>
<![endif]-->
So, just point to the html5.js file and this should fix it. Let me know whether this worked for you.
Cheers, Marvin
Whilst debugging a website I found this tag below the body of the page I was debugging:
<link rel="stylesheet" type="text/css" href="data:text/css,">
and I thought that some crazy Javascript-Error was adding this to my site. But I could not find anything like that in all of the project's source-code.
After checking back with Firefox I noticed, that only Chrome displays this tag in the Elements-, Resources- and Network-View. It is not visible in the "View Source" of Chrome though.
What is this about?
I experienced the same strange css link, and found that it is due to the AdBlockPlus (ADB) extension for Chrome that I have enabled. When I disable that extension, the link no longer occurs.
I just completed a site: http://www.justcelebrations.co.in . I haven't launched it yet because of certain problems. The site uses css3 text gradients to style text in span and border radius to style most divs. It has to be made dynamic later so I don't want to change the text effects to images or something. The problem I am facing is that the site hangs IE8. I haven't tested it in lower versions of IE. I have tested the markup thoroughly and its validated and the css too is valid except for features which are from css3 like opacity, border-radius etc. I have also added google script to make ie behave properly and mordenizer library. The site still hangs IE8. Please Help me out here..
EDIT: after a lot of testing and debugging, found out that ie<9 were crashing because of some text elements being styled by p:first-letter or h1:first-letter (which, as is the case with ie, is totally random as :first-letter is supported by IE7+ ). So all i did was separated those styles from base.css to a non-ie.css and loaded that file with a [if ! lt IE 9]
and it worked!
after a lot of testing and debugging, found out that ie<9 were crashing because of some text elements being styled by p:first-letter or h1:first-letter (which, as is the case with ie, is totally random as :first-letter is supported by IE7+ ). So all i did was separated those styles from base.css to a non-ie.css and loaded that file with a [if ! lt IE 9] and it worked!
Can you add <!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]--> to target fixes. As you make changes view in IE8 through IE9(F12) and play with -ie-(compared to -moz- & -o-) in your css. I would also keep a CSS 2.1 file and a CSS3 file to keep track of your new code.
It's working good here in Safari. Just to narrow this down, what if you remove all the conditional and IE specific libraries you got from Google? In my experience, all the various JS libraries that are supposed to make older IE versions behave always seem to break or conflict with some other script or library like jQuery.
Also see the answer in this thread for optimizing your page loading by placing the JavaScripts at the end of the <body> section. Perhaps in your case, loading the JS last will make some kind of difference to Explorer.
Here's my JS insert:
<script type="text/javascript" src="include/profile.js"></script>
In IE8 with "Compatibility View," the file never loads. The first line in the file is a simple alert() call, so that I know it loaded. Change the browser to Standards View, and it loads fine.
Also, if I add:
<meta http-equiv="X-UA-Compatible" content="IE=100" >
It forces to Standards View and it loads fine.
Any idea why this would be the case? I've not been able to test against IE7, but I know the JS file also does not load in IE6.
Right now the tag is in the section of the file.
It would seem that IE8, Safari, Firefox, et al will tolerate certain JavaScript syntax errors. IE7 and IE6 (and IE8 in 'compatibility view') will not, and they will also not throw a parse error or any other kind of clue.
Pasting my code into http://www.jslint.com/ revealed a couple of syntax errors that weren't affecting the code's operation in other browsers. So boo on me.
Okay. Had the same problem on IE8 and safari 5 on windows and finally got this working. This one is really beauty...
I had a function with a parameter named 'class' which was causing the issue. Renaming to clsname fixed the problem. Apparently FF and chrome were lenient about this.
Turn on script debugging and see if you are getting a javascript error in compatibility mode. The presence of an error would keep the javascript from executing even if it is loaded. You might also want to use the developer tools in IE8 to debug the javascript and/or verify if the file is loaded or not.
just spent couple of hours on this - IE7 & 8 suffers from "return" identificator
I had:
m["return"] = 123;
var x = m.return; // SILENT ERROR!
Obviously, renamaing identificator solves this