We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 31902
    • 342 Posts
    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
      • 33968
      • 863 Posts
      Can’t say I’ve seen this before - are you sure it’s not an html/css issue rather than modx?

      The new doctype you have declared is the new HTML5 standard and is perfectly valid. However you should also be able to get away with keeping your original doctype and just adding the compatibility meta tag.
        • 31902
        • 342 Posts
        Quote from: lucas at Mar 30, 2011, 03:16 PM

        Can’t say I’ve seen this before - are you sure it’s not an html/css issue rather than modx?

        The new doctype you have declared is the new HTML5 standard and is perfectly valid. However you should also be able to get away with keeping your original doctype and just adding the compatibility meta tag.

        Which is something I’ve been wondering. Can you give an example as to how to word it?

        As for the first part of your response, I’m not sure.
          • 33968
          • 863 Posts
          Well, you should be fine with the HTML5 doctype and it could be a good opportunity to start using the new standard smiley

          If you want to hang on to your transitional doctype I would include the X-UA-Compatible meta tag and see if it still works in IE8 Compatibility mode. I don’t see any reason why it shouldn’t if your markup and css is valid.

          Note that this should be inside your <head></head> tags, not directly after the doctype:
          <meta http-equiv="X-UA-Compatible" content="edge" >
          


          IE8’s ’Compatibility mode’ basically instructs the browser to use the old IE7 rendering engine, complete with bugs and quirks. Have a read here for more about it:
          http://www.alistapart.com/articles/beyonddoctype

          I personally hate the idea of having to add extra code to get around the fact that a browser doesn’t meet web standards in the first place >:( But that’s the way it is...

          As for MODx - seeing it gives you full control over the markup, I really don’t think it has anything to do with this