One of our clients uses compatibility view for our site. Our website pages are old and cannot render in Standards mode. In IE10 compatibility view, if there is no doctype declaration, it forces it to IE5 Quirks mode.
Is there a way from html to force it to IE Default Quirks mode?
Yes. Use an x-ua-compatible header to emulate IE10's behavior.
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE10">
You can add this to each page's <HEAD> section or serve it using the web server.
(More of the underlying behavior change can be found here.)
Hope this helps...
-- Lance
Related
I made changes in the master page of my SharePoint site. I have added a meta tag in my header like so:
<meta http-equiv="X-UA-Compatible" content="IE=8,9,10,11" />
and I've also changed the doctype, but the emulation is still rendering in IE9 document mode.
Attached is the screenshot.
Please let me know where I need to make changes. This site is using custom master page. I have updated it in the Custom as well as the V4 master page but no luck.
A few suggestions:
Set the content attribute of the <meta> tag to "IE=8" instead of "IE=8,9,10,11".
Make sure that the <meta> tag containing your IE rendering directive is the first <meta> tag in the header.
To prevent the F12 developer tools window from forcing the page into a particular document mode, close all instances of Internet Explorer, then start it up again and revisit the site without the F12 developer tools open. Open the F12 developer tools to check the page document mode only after the page has loaded.
My team is having a strange issue with the dojo combobox. When we moved the code to the integration environment, the dojo combobox started to render improperly. We verified that the code is the same. Strangely other dojo comboboxes in the same application render normally.
The integration server is on a older version: 9.0.1 HF32 64 bit
The unit server where it works is at: 9.0.1 FP3 HF632
UNIT SERVER rendering on left, INTG Server rendering on right.
My question is has anybody seen this and do they know how to fix it?
Notes:
this happens in IE and Chrome. It is coming wrong from the server.
We are using CIAO to promote between environments (which I hate).
Upgrading the server is not an option for me
I can post code if requested, but I suspect that it isn't a code issue.
UPDATE: For some reason the following two CSS files are not loaded on that particular page. They are loaded on every other page in the application. I can't find any property or setting that would effect this. The admin verified that these files are on the server and the dates are identical. These are system generated resources.
<link rel="stylesheet" type="text/css" href="/oneuiv2.1/base/dojo.css">
<link rel="stylesheet" type="text/css" href="/oneuiv2.1/defaultTheme/dojoTheme.css">
Does anyone know why these two stylesheets are not being loaded??
I've seen some strange positioning issues depending on where Dojo comboboxes are relative to the browser screen, i.e. if there's not enough space left in the screen to position relative to the field they're bound to. That may have been in XPiNC and was in older versions. The thing to check is whether the rendering issue is related to where the field is relative to the page in the browser.
I am out of wit as how to solve this problem in Javascript or HTML. I have customers currently using web applications built for ie9 and under. These legacy applications do not work well on IE11. IT solutions was to enable enterprises mode. Enterprises mode was designed to avoid "common compatibility problems associated with web apps written and tested on older versions of Internet Explorer".
See: http://www.eightforums.com/tutorials/43972-ie11-enterprise-mode-enable-disable-users.html
Enabling enterprises mode appear to be problematic on web application written using Bootstrap and AngularJS. Ie, responsive does not work at all unless enterprises mode is disabled. Not just AngularJS and Bootstrap but other libraries as well.
The solution that I am looking for is a way to check the status of enterprises mode via javascript, then tell the users to either enable / disable the mode. Better, if it can be turn off / on automatically via JS or HTML attributes.
Snooping in the document.x and window.x objects, I do not see any properties that we would give me an indication that enterprises mode is enable. Any suggestion?
Repro(s):
IE11 > Developer Tool > Console > Type window
IE11 > Developer Tool > Console > Type document
There is no DOM property that indicates that you're running EMIE. The whole idea of EMIE is to emulate IE8 behavior better than the IE8 document mode emulates IE8 behavior. EMIE should only be used in specific cases where it's needed; it should not be used wholesale.
It is possible to detect EMIE in certain cases. If you look carefully at the list of user-agent strings over the last couple of releases, there's a noticeable difference between EMIE on IE11 and the user agent string for IE11 RTM.
However, before you take that as your magic bullet, there are two caveats:
You cannot disable EMIE programmatically. It's a local configuration change only.
The user agent for IE11 is completely different today than it was when IE11 was released. Based on reports from the IE team, the UA string is going to be even more complicated, especially once "IE Spartan" (or whatever they choose to call it") hits the wire.
My recommendation? Create a small launcher page that does a simple feature detection for the web app in question. If you detect features consistent with what's needed for the app, then display a link to launch the app. If feature detection fails to detect IE8, IE11, or whatever version you've targeted, display a warning with a link to more troubleshooting information. Be sure to include a launch link anyway, just in case.
This way, the user has the information they need and you have a lightweight way of handling the issue, one that doesn't require too many updates to the app in question.
Hope this helps...
-- Lance
To my mind the reason of the issue is that IE 11 Enterprise mode emulates IE 8. But bootstrap doesn't support IE 8. To overcome it just use HTML5 shim and Respond.js as described here.
<script src="js/respond.min.js"></script>
<script src="js/html5shiv.min.js"></script>
But without check like <!--[if lt IE 9]> - because it seems that it doesn't work in the enterprise mode.
The better solution would be not just include the mentioned scripts without conditions but find out the appropriate condition instead of < IE 9.
To fix the problem with angularjs just use the following meta tag:
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
For those who also struggled with this problem. I have submitted a feature request to MS IE Team.
See:
https://connect.microsoft.com/IE/feedback/details/1159543/need-a-way-for-client-side-codes-to-detect-enterprises-mode
My solution is a workaround that involve checking the width of the container div. Enterprises mode do not support responsive.
I've developed a mobile website based on jQuery Mobile. Everything works on my own Windows Mobile device with Opera Mobile 10, but a customer of mine always sees the page magnified.
I thought that he might have a zoom setting >100% in Opera Mobile, but he claims that this is definitely not the case.
The same problem also occurs on the jQuery Mobile test site ( http://jquerymobile.com/test/ ) . Here's a screenshot of the site as displayed on my customer's device:
Any idea what might be going wrong here? I was unable to reproduce this problem on my own device or in an emulator.
My customer's device is a HTC HD2 runing Windows Mobile 6.5 and Opera 10.
Thanks,
Adrian
I'll just paste the answer by David Storey which was made for this on Opera Dev forums. It is not specifically about the 100% issue, but there might be similar issues related to the viewport tag issue, for people getting across it.
Opera Mobile assumes that any document
with a mobile specific doctype, such
as XHTML Mobile Profile or XHTML Basic
are designed and optimised for mobile,
while documents with a regular doctype
are not optimised for mobile
generally. Thus if there is a desktop
doctype the overview mode is enabled,
which you can control with the
viewport meta element. If there is a
mobile doctype the overview mode is
disabled and a regular 1:1 viewport is
used.
There were some bugs in the viewport
meta element support in Opera Mobile.
They should be fixed in the latest
version.
Did you try adjusting the scale?
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0">
You should use xhtml mobile doctype
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
Try adding <meta name="viewport" content="width=device-width">. Opera seems to behave better when it's there.
If that doesn't work, please file a bug report https://bugs.opera.com/wizard/.
How can I test if <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> does work? Especially if I let Apache handle it via htaccess.
Is there something in the IE developer tools?
Check it in IE8. If it is not set, Tools > Compatibility View will be usable. If it is set, the option will be grayed out and not usable.
check the "page default" of document mode, from IE developer tool bar.
Do you see the "broken" document icon between search and reload icons in the image? This is the Compatibility View button. If the edge value set using the meta tag or htaccess header worked, the Compatibility View button is not shown.
Image courtesy of Frank Code blog; you may also have a read at the post, if you want. It's worth it.