1

when I run my site on for example: /localhost/Test then the box-model and table borders/padding/spacing etc... looks normal.

Example IE9 Box Model OK localHost: http://www.flickr.com/photos/cenesam/6243269622/in/photostream

When I run the same test site on: /my computer name/Test then IE9 goes wacky and the box-model increases padding / spacing etc...

Example IE9 BoxModel NOK Computername: Url: http://www.flickr.com/photos/cenesam/6242752657/in/photostream

Does anyone recognize this behaviour and knows how to deal with this? I've included 2 sample pictures to show the visual problem. One is with localhost one is with computer name.

Any ideas are much appreciated. Thanks, Joost

Finaly found the answer somewhere on the web. Spudley (thank you!) pointed me to the right direction. This meta tag was definitly the answer!!

But what is important that IE NEEDS this tag to be the FIRST one in the Head section. My site uses a theming engine which parses the styles in the head tag and therefore it was not working.

Now I'm overriding this in web.config (webserver section) by:

<httpProtocol>
      <customHeaders>
        <remove name="X-UA-Compatible" />
        <add name="X-UA-Compatible" value="IE=Edge" />
      </customHeaders>
</httpProtocol>

And now it finaly works again. Thank you all for thinking with me!

Joost Verdaasdonk
  • 327
  • 2
  • 8
  • O I forget the images are from a default asp.net webapplication with 1 asp table inserted in the bottom to show the cellspacing problem. – Joost Verdaasdonk Oct 14 '11 at 09:40

3 Answers3

2

Check the developer tools window (press F12) to see what rendering mode is being used.

IE has config settings which can cause it to fall back into compatibility mode in certain circumstances. One of those circumstances is when it's run on a "local intranet site" (which includes localhost).

Go to the IE Tools menu, and pick the "Compatibility View Settings" to change the config on this.

To force the site to load in the correct mode regardless of this setting, you can include the following meta tag in your HTML <head>:

<meta http-equiv="X-UA-Compatible" content="IE=Edge" />

Hope that helps.

Spudley
  • 166,037
  • 39
  • 233
  • 307
  • Hi Spudley looks like your on the right track thank you for that. If I look at the bad site it has: Browsermode IE9 Compat mode Documentmode IE7 standards (This is wrong) In the correct site both are IE9 I tried to change this by doing: But IE keeps forcing documentmode to IE7 More ideas? Thanks Joost – Joost Verdaasdonk Oct 14 '11 at 11:38
  • FYI I've validated the page through an online validator and it passed the doctype standard – Joost Verdaasdonk Oct 14 '11 at 11:59
  • This adds to my thesis that it has something to do with the compatibility mode. (I will update the comment above) – campino2k Oct 14 '11 at 13:50
  • Hi Campino, Sure it does.. question still remains how to force IE in the prober mode because the tag suggested by spudley is beeing ignored.. / I have valid doctype and html so... What todo? – Joost Verdaasdonk Oct 14 '11 at 14:04
  • I'm surprised because that meta tag ought to override any user settings and force IE not to use compat mode. You did put it into the ``, right? It's also possible to specify an HTTP header with the same `X-UA-Compatible` flag; you could try that, but that should work the same as the meta tag. – Spudley Oct 14 '11 at 14:06
  • Hi Spudley, I'm surprised too but still it is what is is. How would that http header look? Because I'm not sure what you mean with your last suggestion? Thanks. – Joost Verdaasdonk Oct 14 '11 at 14:23
  • An HTTP header would be defined either in your server config (see [here for how to config in Apache](http://stackoverflow.com/questions/831119/how-do-i-set-x-ua-compatible-header-to-ie-emulateie7-for-ie-8-browsers-using-apac)) or in your server-side code (eg PHP: `header('X-UA-Compatible: IE=Edge");` etc). It should do the same as setting the `` tag, but I have heard some reports that it's more reliable than the meta tag. I wouldn't know why though. – Spudley Oct 14 '11 at 14:50
  • Hi Spudley thanks I just updated the question with the ultimate answer. The big catch here was that this META tag needs to be the FIRST tag in the header for IE to see it.... go figure... – Joost Verdaasdonk Oct 14 '11 at 15:14
0

Have you included an html doctype in the page? Ie9 modifies its behavior depending on the value of the doctype and/or meta tags.

http://www.google.com/search?hl=en&q=ie9+doctype+site%3Amicrosoft.com

Cheeso
  • 189,189
  • 101
  • 473
  • 713
0

Check for the "compatibility view" icon in the URL bar (the "broken page") and look if clicking (i.e. "activating" it) changes something.

Display the menu bar (right-click -> menubar) go to extras -> compatibility view preferences (like this, i got the german version here) and remove the "intranet" checkbox.

campino2k
  • 1,618
  • 1
  • 14
  • 25