I am using white-space: pre-wrap. Content is not being wrapped in IE in Quirk mode.
Is there any solution to get it working for quirk mode?
Note: It is working fine in strict mode of IE8 and IE9.
Quirks mode is for backwards compatibility with very old browsers like IE5, which do not comply with standards (aka strict) mode. The pre-wrap property is supported in IE8 and higher, but not IE 5-7:
http://www.quirksmode.org/css/whitespace.html
In this situation, there are two options:
Don't support browsers that are non-compliant with w3 standards
Send incompatible IE versions a different stylesheet using IE conditionals
Related
I would like to make my website compatible with all types of internet explorer, as at the moment it is only compatible with IE6, and glitches a lot in newer versions. How can I do this? I understand it has something to do with the code below that I found in a file named "ie6.css". Tha code is below.
/* IE6 specific styles */
.extra-wrap, .news li {zoom:1;}
Firstly, make sure you have a valid <!DOCTYPE>. That's the number 1 reason for browser glitches between different browsers/versions.
If you don't have a doctype declaration at the top of your page, the browser will go into Quirks mode, which will cause you problems.
Give it a valid doctype (best go with <!DOCTYPE html>). That might cause other issues in the short term, but once you've fixed those it will be much better at working properly cross-browser.
Secondly, does it work in other browsers (Firefox, Chrome, etc)? Modern IE versions are generally standards compliant, so if it works in other browsers it should work in IE10/11. If it works in other browsers and not IE11, then you probably have some IE-specific hacks that were needed for older IE version but don't need to be there for newer versions. Get rid of those.
How do you activate quirks mode only for IE versions below IE8 on a page where the doctype html5 is set? Or, is possible to interpret a piece of code in quirks mode?
It appears to be possible to achieve this by combining any HTML comment (<!-- anything -->) before the doctype (this triggers Quirks mode in IE6—9) and <meta http-equiv="X-UA-Compatible"content="IE=Edge"> (which has precedence over the doctype and triggers Standards mode in IE8—9). So only IE6—7 will have Quirks mode, and IE8+ and all non-IE browsers will switch to Standards mode.
When a DOCTYPE isn't defined or is mispelled, etc. are the older IEs the only browsers that go into quirks mode?
Or does super old Firefox, Safari, etc. do this as well?
No, browsers generally have a quirks mode. Each browser has its own quirks mode, though they share some of the behavior. There have been attempts to specify what exactly happens in quirks mode (more or less making it defined behavior), but the current situation is a mess: if you do not use a doctype string that triggers “standards mode”, you will get different quirks on different browsers.
See Activating Browser Modes with Doctype and What happens in Quirks Mode?
A short look into Wikipedia answers this...
I have a project experience map that is generated by JetPhoto software... it's wonderful, and is exactly what I needed. Unfortunately, it seems to get stuck in IE9. If I tell IE9 to use "compatibility mode", all the pins load fine (like in every other browser). The portfolio is up here: http://www.aboutcis.com/experience/
Is there any way to tell IE9 to load the page in compatibility view for all users?
I'm not much for HTML (it's gotten so complicated compared to when I learned it), but I came across the following tag...
<meta http-equiv="X-UA-Compatible" content="IE=7">
Is this the intended use of this tag? Am I on the right track? Does anyone have a tip or idea that might help me understand how to overcome this? Is this a DOCTYPE issue maybe (which I understand nothing about)?
Thanks!
The syntax for compatibility mode is:
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9" >
The content attribute specifies the mode for the page; to mimic the behavior of Internet Explorer 7, specify IE=EmulateIE7. Specify IE=5, IE=7, IE=8 or IE=9 to select one of those compatibility modes. You can also specify IE=edge to tell Internet Explorer to use the highest mode available.
Understanding Document Compatibility Modes
Internet Explorer supports a number of document compatibility modes that enable different features and can affect the way content is displayed:
IE9 mode provides the highest support available for established and
emerging industry standards, including the HTML5 (Working Draft), W3C
Cascading Style Sheets Level 3 Specification (Working Draft),
Scalable Vector Graphics (SVG) 1.0 Specification, and others.
IE8 mode supports many established standards, including the W3C
Cascading Style Sheets Level 2.1 Specification and the W3C Selectors
API; it also provides limited support for the W3C Cascading Style
Sheets Level 3 Specification (Working Draft) and other emerging
standards.
IE7 mode renders content as if it were displayed in standards mode by
Internet Explorer 7, whether or not the page contains a <!DOCTYPE>
directive.
Emulate IE9 mode tells Internet Explorer to use the <!DOCTYPE>
directive to determine how to render content. Standards mode
directives are displayed in IE9 mode and quirks mode directives are
displayed in IE5 mode. Unlike IE9 mode, Emulate IE9 mode respects the
<!DOCTYPE> directive.
Emulate IE8 mode tells Internet Explorer to use the <!DOCTYPE>
directive to determine how to render content. Standards mode
directives are displayed in IE8 mode and quirks mode directives are
displayed in IE5 mode. Unlike IE8 mode, Emulate IE8 mode respects the
<!DOCTYPE> directive.
Emulate IE7 mode tells Internet Explorer to use the <!DOCTYPE>
directive to determine how to render content. Standards mode
directives are displayed in Internet Explorer 7 standards mode and
quirks mode directives are displayed in IE5 mode. Unlike IE7 mode,
Emulate IE7 mode respects the <!DOCTYPE> directive. For many web
sites, this is the preferred compatibility mode.
IE5 mode renders content as if it were displayed in quirks mode by
Internet Explorer 7, which is very similar to the way content was
displayed in Microsoft Internet Explorer 5.
Edge mode tells Internet Explorer to display content in the highest
mode available. With Internet Explorer 9, this is equivalent to IE9
mode. If a (hypothetical) future release of Internet Explorer
supported a higher compatibility mode, pages set to edge mode would
appear in the highest mode supported by that version. Those same
pages would still appear in IE9 mode when viewed with Internet
Explorer 9.
Because edge mode documents display webpages using the highest mode available to the version of Internet Explorer used to view them, it is recommended that you should only use this document mode for testing purposes only. Do not use it for production uses.
For more information on IE compatibility mode, check this out.
Is there a way — for example with something like <!--[if IE 8]> — to get a stylesheet only for IE8 and IE in «Compatibly View»?
I ran into a (SharePoint-Layout-)Problem, which only occurs if IE8 is in «IE8 Compat View»-Browser-Mode, but works just fine if IE8 is «IE8»- or «IE7»-Browser-Mode. If I get the stylesheet only with <!--[if IE 8]>, the css will be ignored if IE8 is in compatibly view because it 'behaves like IE7' — the css will only be loaded if IE8 is in «IE8»-Browser-Mode. But I need it also if he is in the «IE8 Compat View»-Browser-Mode.
See the SO post "Detect IE8 Compatibility Mode", in which user Mark Kamoski mentions the Microsoft article Defining Document Compatibility.
If you browse to the section Determining Document Compatibility Mode, you can use a test on document.documentMode (and document.compatMode for older browsers) to determine the mode. I don't know of how to roll this into a purely CSS implementation, but you can dynamically generate some CSS using some code to achieve this.