In the last few days we have noticed that IE8 during page load occasionally shows momentarily a blank (white) page. It does not happen every single time. I would estimate about 10%. This issue has been brought to our attention by visitors on a site with several millions pages a day, which suggests that it has really appeared very recently. However, a quick look at the recent Windows updates did not reveal any changes related to IE at all. Also, I tried to turn on and off all possible options in IE, turn off all extensions, switch on and off compatibility mode, tried various doctypes etc. without any success. The problem can be demonstrated even on a very simple example:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Test</title>
<style type="text/css">
body { background-color: Black; color: White; }
a { color: White; }
</style>
</head>
<body style="background-color: Black;" bgcolor="Black">
Reload
</body>
</html>
Just click on the reload link repeatedly, and you will see a white flash occasionally. Can anybody else confirm it? I run Vista, but it has been reported also on XP. It seems like some internal repainting problem such as when you don’t make the window background transparent in the RegisterClass function.
I've got the same problem with some sites I've build. It's very annoying and I haven't seem to solve it yet. Same occurs in IE6 and IE7, but that can be 'solved' with
<meta http-equiv="Page-Enter" content="blendTrans(Duration=0)" />
<meta http-equiv="Page-Exit" content="blendTrans(Duration=0)" />
Couldn't find a solution for version 8.
I had a similar issue and searched every where for an answer. I think I may have it. I had a flash banner and would get an ugly white flash that filled the browser whenever I clicked on a link to a new page or did a refresh. I placed wmode:'transparent' in the parameter list for the swf object. Now it looks the same as FF - no ugly white flash!
swfobject.embedSWF('banner.swf', 'flashcontent', '960', '120', '9.0.0', 'assets/swfobject/expressinstall.swf', {}, {bgcolor: '#000000', menu: 'false', wmode:'transparent'}, {id: 'flashcontent'});
Related
I have a page using the mixitup jquery script.
It works perfectly in Chrome, Opera and IE11.
But I need it to work in IE8 too.
I have the script working in IE8, just without the fancy animations, which is fine.
Except, it only works in IE8 when I set the browser compatibility view to 'Internet Explorer 8 Compatibility View'.
In the screenshot below, it shows different version, but you can see what option I mean, the second one rather than the first one.
I have tried entering the following meta to the top of page:
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
and also:
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" >
But both those just seem to force the 'Internet Explorer 8', the equivalent to the top options in the screenshot... not the second one, which I need.
Can that be done?
thanks
If I understand your question correctly then may be below explanation will help you.
Using <meta http-equiv="X-UA-Compatible" content=" _______ " />
The Standard User Agent modes (the non-emulate ones) ignore <!DOCTYPE> directives in your page and render based on the standards supported by that version of IE (e.g., IE=8 will better obey table border spacing and some pseudo selectors than IE=7).
Whereas, the Emulate modes tell IE to follow any <!DOCTYPE> directives in your page, rendering standards mode based the version you choose and quirks mode based on IE=5
Possible values for the content attribute are:
content="IE=5"
content="IE=7"
content="IE=EmulateIE7"
content="IE=8"
content="IE=EmulateIE8"
content="IE=9"
content="IE=EmulateIE9"
content="IE=edge"
If meta tag solution wasn't working for you then set it
header('X-UA-Compatible: IE=edge,chrome=1');
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
I just have a quick question about IE8 Standards mode vs Quirks mode.
The page displays fine if you load its first page then log in. I have searched for the doc type which i think is right for changing the page to IE8 Standards Mode and i think it works because IE's built in debugger says it's in that mode. Also if you start on another page which uses quirks mode then navigate to my site the debugger changes modes to IE8 standards.
The problem starts if your change the mode to IE8 standards before you visit the page. e.g say your on google and change the mode in the debugger to IE8 standards then visit the site the page isn't displayed correctly.
I hope i've explained my problem clearly enough. I've posted the doctype i'm using is that is any help.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Add this meta tag to the head
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
This will force IE into the latest standards mode. So if they have IE8 it will be in IE8 even if its set before to other mode.
Also you could start using the html doctype without problem
<!DOCTYPE html>
You can read more about it here:
The IE Blog has posted "How IE8 Determines Document Mode" which you should read. Also, note that MS introduced a (... ah! Geries beat me to the punch while typing this!) Take a look at Geries' comment. :)
I understand from my research that IE8 does annoying things like forcing itself into IE7 mode for local intranet hosts and local IP ranges. I understand from a previous question that there is no way to use conditional statements as, irrespective of whether IE8 is rendering in IE8 or IE7 mode, it will still only use the <!--[if IE 8]> conditional.
Since this question was asked a while ago (during the IE8 beta phase by the looks of things) I am wondering if this has changed or if there is any other way using conditionals to determine if IE8 is in compatibility mode.
Thanks!
No, you can't do it using conditionals.
The best way to do it is to use the document.documentMode property as described in the link Pekka posted. How can I detect if IE8 is running in compatibility view?
http://msmvps.com/blogs/paulomorgado/archive/2010/04/05/defining-document-compatibility-in-internet-explorer-8.aspx
In the end, I chose to mix the two common strategies to deal with this bug.
I created an override CSS file, which I import using conditional comments. In the event of IE 8 or 9, though, this override doesn't look as good, so I include the 'force IE into latest rendering mode' header switch, as shown below.
<!--[if lte IE 7]>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" type="text/css" href="/Content/IE7Overrides.csss" />
<![endif]-->
This provides IE7 with a decent failsafe, but forces IE8 and IE9 to show it in the latest browser, which will show the CSS-based table correctly.
I have two nested divs that are supposed to both be 400 pixels tall. The sidebar div shows up correctly in Chrome and Firefox, but in Internet Explorer 8 I'm having trouble getting it to be wide enough AND tall enough due to Internet Explorer's screwed up box model.
I've tried using the box model hack to fix it, but it didn't appear to do anything, so I removed it. I tried using a fixed width on the sidebar Internet Explorer hack by calculating how much 19% of 880 (the width of the #container div) was (it was 168 pixels + the 20 pixels for the left and right padding = 188 pixels), but that didn't appear to change anything, it was the same size in Internet Explorer.
How do I make this web page to look the same in Internet Explorer as it does in Firefox and Chrome? I'm a beginner to this box model hacking.
The source code can be found here: http://68.82.27.200/alienscientist/.
Also, the top menu isn't wide enough, and the header isn't tall enough, in Internet Explorer. I haven't gotten to trying to fix that yet but can the fix for the sidebar be applied to those?
The Box Model problem shouldn't be an issue in IE8 if you use a strict doctype. I can see you've declared a strict, but a few issues at the top of your html could be cancelling this:
<!-- BEGIN HTML HEADER -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" class="webkit safari safari4 mac">
I think the doctype line should be at the top, rather than a comment. You're missing the xml:lang and lang attributes on the html node, which also shouldn't have a class (put those classes on body).
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
That's mostly just an educated hunch, but try changing it and see if the problem fixes.