So, we get a call from a client today telling us that some weird stuff is happening with her ModX site in IE8. The menu is, for some reason, located higher than it should be. In fact, many items are shifted a bit higher than designed. Of course, it looks great here.
A little bit of digging shows her IE8 is in Compatibility View. Well, the site needs to look good, no matter how you view it, right?
Some more investigation shows elements in other ModX sites we built are shifted higher, too, in IE8, operating in Compatibility View.
After a little digging, I get to this workaround for this problem, as stated on the MS site:
http://msdn.microsoft.com/en-us/library/cc288325%28VS.85%29.aspx#SetMode
As I understand it, I’m supposed to replace the top Meta, such as this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
with:
<!DOCTYPE html><meta http-equiv="X-UA-Compatible" content="edge" >
...which works. It basically seems to kill the compatibility view and forces the visitor’s IE to see the site as if compatibility mode is not on (which is what is happening...even the compatibility button is no longer there).
And, that’s great and fine, but now I’m wondering: What happens to any benefits of using a standards-compliant Meta at the top of the head? I know I’m showing my ignorance here but what am I missing? Is the page standards compliant with this IE work-around declaration?
Anyone come across this situation? It seems to want to be an issue with all the ModX sites, even though I’m sure my sites are otherwise designed with standards compliant structure.
All ModX sites are v2.0.6 or newer
PHP Version 5.2.10 for all sites