I've noticed some websites IE will automatically trigger to display in compatibility view, but once you disable it, it won't auto-trigger anymore. How do you make the browser reset this behavior so it will go back to how it was before it was disabled, to see if it auto triggers it or not?
I've tried clearing it out in websites to view in compatibility view and it still doesn't reset its behavior of auto-triggering compatibility view.
It often happens when a doctype either isn't set, or is set incorrectly. Plus, even if a doctype is set correctly, if PHP or manual code entry leads to anything being output before the doctype, it can also cause this issue.
If you press F12 you should get the Developer tools. There is a drop-down menu at the top titled "Browser Mode" - in there you should find compatibility view. Also, restarting IE can sometimes work for me.
Related
I'm working on a legacy system that has a mishmash of browser dependent features (don't ask). The plan is to revamp everything to be current, but in the meantime, I need to figure out a way to make the following happen:
If the user has Browser Mode set to compatibility mode for this site or in general, I need to make the Document Mode IE8. This specific case I'm looking into, I'm using IE10. When you switch to IE10 Compatibility mode, the "page default" for the Document Mode is Internet Explorer 7. If I could just make the page default Internet Explorer 8, I think that would solve my case for now.
When I try to use in the header, it ALWAYS forces to IE 8 compat mode.
I realize this is a very strange way to do things, and it's only temporary until I can properly fix the insanity....
Which IE8 mode do you want? IE8 Standards mode or IE8 "use the <!doctype>" mode? If the former, set x-ua-compatible to IE8. If the latter, set it to EmulateIE8. (The various options, in gory detail, can be found here.
(The first value specifically chooses IE8 standards mode as the target mode; the second will pick IE8 standards mode if the page contains a standards mode <doctype> or IE5 quirks mode if the page doesn't contain a <doctype>.)
The key is knowing which legacy document mode that you need for the page. Figure that out and target that mode specifically. (Use the Emulation tab of the Developer Tools to switch between modes until you find the one that works.)
Note that if you deploy the page to an Intranet (right click, choose Properties, and then check out the Zone value), you may wish to add a Mark of the Web to the page so that it opens in the Internet zone and avoids the various defaults that behave otherwise.
My client uses ie8 and the site I made for them works fine in all other browsers EXCEPT ie8. Most things are out of place and I can't figure out what styles are causing this to happen. I am now using ie conditional styling, but I don't know what to put in my stylesheet since I am not sure what attributes are not showing up.
Anyone know a software that compared your style css to what styles are actually being used?
Assuming that you're running the latest IE, run the developer tools (press F12 while viewing your webpage, or go to IE's Tools -> F12 Developer Tools menu), and select the Emulation tab, then change the document mode to IE8. You can then inspect the element that's causing the issue. Unfortunately you'll have to do trial by elimination in order to find out what styles are or aren't being used.
I know of no software that will automate this for you, but you can check for this yourself at 'http://caniuse.com/#cats=CSS'
This keeps very up-to-date data on browsers and their feature compatibility.
Have you tried pressing F12 to access developer tools? If you click on the DOM explorer tab, you can browse through the code.
Once you find the part of the code you are interested in, you can click on it and see the relevant css in the panel on the right.
I've posted a photo here: http://epic-xp.com/wp-content/uploads/2015/02/test.png
I have just finished the layout for my website, and it is working perfectly fine in all browsers (Opera, Safari, Chrome, IE 7, 8, 9, 10 (both), and several others) - but this time around, the Compatibility View button in the address bar of IE 10 is appearing. This has not happened for a very long time and it's really annoying me.
I don't want the Compatibility View button to display at all. It sends a bad message to viewers/visitors. In this case, I have tested my whole site on different computers all running different browsers and different versions of browsers and I have not noticed a single problem.
Why is the Compatibility View button appearing if there are no issues?
Here's the problem, and like I said, everything works fine - except for when I turn ON Compatibility View in IE 10. When I turn it ON, the only things in my entire website I can see is my logo, and a little image in the top right corner of the page (but they're positioned exactly where I wanted them). What gives?
There's nothing wrong with the code - seriously. i've had it validated several times, all AJAX stuff works like a charm, and I really tried so hard to find a problem and I even intentionally tried to mess it up but it's working really well. The positioning of everything is spot on.
So what's the deal with this Compatibility View junk? Why is it there - on a website that does not have any issues? And, most importantly, is it important that I make sure my website works well while in Compatibility View even though it works perfectly when it's off and even though it works perfectly in all the major browsers - and then some?
First and foremost, you can force IE not to display the Compatibility View button simply by adding this to your page head:
<meta http-equiv="X-UA-Compatible" content="IE=edge">
As for your other questions:
Why is the Compatibility View button appearing if there are no issues?
So what's the deal with this Compatibility View junk? Why is it there - on a website that does not have any issues?
It's there in case a site, typically one that was written many years ago, fails to work in a newer version of IE, to allow users to view or IE to display it in a legacy rendering mode where it will hopefully work better.
Additionally, it's there by default because legacy sites will not even have the meta tag above to begin with. In order for the button to display when viewing existing sites without having to update their code, it's only logical to make it an opt-out feature instead, by having the developer add it to new code to tell newer versions of IE to hide the button when it's not needed.
And, most importantly, is it important that I make sure my website works well while in Compatibility View even though it works perfectly when it's off and even though it works perfectly in all the major browsers - and then some?
Compatibility View is meant for websites that were specifically designed for legacy browsers, and as such, depend on legacy rendering quirks not present in more recent browsers which may cause "problems" in those more recent browsers.
Without seeing your site, we won't be able to determine why it works in IE7 and IE10 in IE7 mode but not Compatibility View, but if it works well in newer versions of IE, you do not need to ensure that it works well in Compatibility View. Using the meta tag above to hide the button when it's not necessary will suffice.
Can you provide us a link to your site? I always use
<!DOCTYPE html>
on the first line of the HTML document. This is a universal switch to the latest rendering mode in all modern browsers. Use BoltClock's solution to hide a compatible view button in IE's address bar. I would prefer a HTTP header rather than HTML meta tag, because the meta tag causes parser switch and reset.
I created a quick and dirty HTML file to demonstrate an issue I am encountering in IE compatibility mode. When I open it in IE8 from my desktop, it opens in standard mode. I need to be able to switch it to compatibility mode, but the icon for that disappears when I am viewing a local HTML document. What's up with that?
UPDATE: None of the three proposed solutions has resulted in the compatibility mode icon showing in IE8. Instead, I have put my code into an .aspx page and executed it through Visual Studio. Since it's originating from localhost, the browser thinks it is a remote document and is displaying the compatibility icon like I wanted.
However, if anyone can get this to work without having to do that, I am still open to ideas since launching a web app isn't really the ideal solution for me.
I'm not sure whether this'll work because of IE's many crazy exceptions and rules regarding local files and compatibility mode, but try the META tag approach.
In your <head>, for example say:
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" >
See understanding compatibility modes to make sure you pick the right one.
You could try pressing F12 to open the developer toolbar, and change it in there.
Update: Have you tried tools > compatibility view settings > display all websites in compatibility view?
Users can override the ‘local
intranet’ setting by un-checking
‘Display intranet sites in
Compatibility View’ at Tools ->
Compatibility View Settings.
http://blogs.msdn.com/b/ie/archive/2009/06/17/compatibility-view-and-smart-defaults.aspx
None of the three proposed solutions has resulted in the compatibility mode icon showing in IE8. Instead, I have put my code into an .aspx page and executed it through Visual Studio. Since it's originating from localhost, the browser thinks it is a remote document and is displaying the compatibility icon like I wanted.
However, if anyone can get this to work without having to do that, I am still open to ideas since launching a web app isn't really the ideal solution for me.
I have just installed IE9 beta and on a specific site I created (HTML5) IE9 jumps to compatibility mode unless I manually tell it not to. I have tried removing several parts of the website but no change. Including removing all CSS includes. On some other website of me it goes just fine.
Also, don't set it manually because then IE9 remembers the user setting and you can't turn it back to automatic (or at least I haven't found how, not even via private browsing and emptying cache)
Anyway. The site where it jumps to compatibility mode: http://alliancesatwar.com/guide/
One where it renders correct: http://geuze.name/basement/ (I can't post more than 1 hyperlink)
Both use the same doctype and all. Those sites have a lot in common(apart from appearance) using the same basic template(encoding, meta tags, doctype and the same javascript)
It would be great if someone has an answer for me! An HTML5 website that renders in IE7-mode is pretty... lame.
Works in IE9 documentMode for me.
Without a X-UA-Compatible header/meta to set an explicit documentMode, you'll get a mode based on:
whether the user has clicked the ‘compatibility view’ button in that domain before;
perhaps also whether this has happened automatically due to some other content on the site causing IE8/9's renderer to crash and fall back to the old renderer;
whether the user has opted to put all sites in compatibility view by default;
whether IE thinks the site is on your intranet and so defaults to compatibility view;
whether the site in question is in Microsoft's own list of websites that require compatibility view.
You can change these settings from ‘Tools -> Compatibility view settings’ from the IE menu. Of course that menu is now sneakily hidden, so you won't see it until you press Alt.
As a site author, if you're confident that your site complies to standards (renders well in other browsers, and uses feature-sniffing to decide what browser workarounds to use), I suggest using:
<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
or the HTTP header:
X-UA-Compatible: IE=Edge
to get the latest renderer whatever IE version is in use.
I put
<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
first thing after
<head>
(I read it somewhere, I can't recall)
I could not believe it did work!!
To force IE to render in IE9 standards mode you should use
<meta http-equiv="X-UA-Compatible" content="IE=edge">
Some conditions may cause IE9 to jump down into the compatibility modes. By default this can occur on intranet sites.
I've posted this comment on a seperate StackOverflow thread, but thought it was worth repeating here:
For our in-house ASP.Net app, adding the "X-UA-Compatible" tag on the web page, in the web.config or in the code-behind made absolutely no difference.
The only thing that worked for us was to manually turn off this setting in IE8:
(Sigh.)
This problem only seems to happen with IE8 & IE9 on intranet sites. External websites will work fine and use the correct version of IE8/9, but for internal websites, IE9 suddenly decides it's actually IE7, and doesn't have any HTML 5 support.
No, I don't quite understand this logic either.
My reluctant solution has been to test whether the browser has HTML 5 support (by creating a canvas, and testing if it's valid), and displaying this message to the user if it's not valid:
It's not particularly user-friendly, but getting the user to turn off this annoying setting
seems to be the only way to let them run in-house HTML 5 web apps properly.
Or get the users to use Chrome. ;-)
The site at http://www.HTML-5.com/index.html does have the X-UA-Compatible meta tag but still goes into Compatibility View as indicated by the "torn page" icon in the address bar. How do you get the menu option to force IE 9 (Final Version 9.0.8112.16421) to render a page in Standards Mode? I tried right clicking that torn page icon as well as the "Alt" key trick to display the additional menu options mentioned by Rene Geuze, but those didn't work.
As an aside on more modern websites, if you are using conditional statements on your html tag as per boilerplate, this will for some reason cause ie9 to default to compatibility mode. The fix here is to move your conditional statements off the html tag and add them to the body tag, in other words out of the head section. That way you can still use those classes in your style sheet to target older browsers.
Looks fine to me:
You're sure you didn't on the settings globally or something? This is a clean installation of the beta on Windows 7. The developer tools report that the page is defaulting to IE9 Standard Mode.
I recently had to resolve this issue and here's what I did :
First of all, this solution is around tuning Apache server.
Second main think is that there's a bug in the IE9 which means that the meta tag will not work, instead of this solution try this
find/open your httpd.conf
uncomment/or add the following line
LoadModule headers_module modules/mod_headers.so
add the following lines
<IfModule headers_module>
Header set X-UA-Compatible: IE=EmulateIE8
</IfModule>
save/restart your Apache server,
browse to your page with IE9, use tools like wireshark or fiddler or use IE developer tools to check the header is there