121 votes

IE10 rend en mode IE7. Comment forcer le mode Standards ?

Sur le site de Microsoft, ils affirment qu'une simple déclaration doctype est suffisante. Mais même un document aussi court que celui-ci retombe en mode IE7 :

<!DOCTYPE html>
<html>
<head>
   <title></title>
</head>
<body>

</body>
</html>

http://d.pr/i/fvzb+

245voto

Daniel Little Points 4451

Internet Explorer part du principe que la plupart des pages Web ont été écrites pour cibler des versions antérieures d'IE et examine le doctype, les métabalises et le HTML pour déterminer le meilleur mode de compatibilité (parfois de manière incorrecte). Même avec un doctype HTML5, IE placera toujours votre site Web en mode de compatibilité s'il s'agit d'un site intranet.

Pour vous assurer que votre site web utilise toujours le dernier mode de normes, vous pouvez soit vous assurer que Display intranet sites in Compatibly est désactivé. Cependant, vous devez le faire sur chaque machine locale au serveur web (les instructions sont ci-dessous).

Alternativement, et mieux encore, vous pouvez utiliser la fonction X-UA-Compatible pour désactiver cette fonction sur le serveur. Il est important de noter que L'utilisation de la balise méta ne fonctionnera pas !

<!-- Doesn't always work! -->
<meta http-equiv="X-UA-Compatible" content="IE=edge" />

Dans tout MSDN, il est mentionné que l'utilisation d'un en-tête d'hôte ou d'une balise méta devrait prévaloir même sur les sites intranet. L'article Comprendre les modes de compatibilité dans Internet Explorer 8 dit ce qui suit .

Un grand nombre de sites Web commerciaux internes sont optimisés pour Internet Explorer 7. Cette exception par défaut préserve donc cette compatibilité. ... De nouveau, si une balise Meta ou un en-tête http est utilisé pour définir un mode de compatibilité pour le document, ces paramètres seront remplacés.

Cependant, dans la pratique, cela ne fonctionnera pas, l'utilisation d'un en-tête d'hôte est la seule option qui fonctionne. La section des commentaires de l'article présente également de nombreux exemples de ce problème précis.

L'utilisation d'une balise Meta présente également plusieurs autres problèmes, comme le fait d'ignorer la balise si elle ne se trouve pas directement sous la balise <head> ou s'il y a trop de données avant (4k). Cela peut également déclencher le reparsage du document dans certaines versions d'IE, ce qui ralentit le rendu. Pour en savoir plus sur ces problèmes, consultez l'article de MSDN. Meilleure pratique : Mettez de l'ordre dans votre tête .

Ajout de l'en-tête X-UA-Compatible

Si vous utilisez .NET et IIS, vous pouvez ajouter ceci à l'adresse suivante web.config vous pouvez aussi le faire par programme :

<system.webServer>
  <httpProtocol>
    <customHeaders>
      <add name="X-UA-Compatible" value="IE=edge" />
    </customHeaders>
  </httpProtocol>
</system.webServer>

Si vous n'utilisez pas IIS, il est facile de le faire dans n'importe quelle langue. Par exemple, voici comment le faire en PHP :

header('X-UA-Compatible: IE=edge');

Tant que le X-UA-Compatible est présent avec le doctype HTML5, un site fonctionnera toujours dans le dernier mode standard.

Désactiver la vue de compatibilité
Il peut toujours être utile de désactiver la vue de compatibilité. Pour ce faire, décochez Display all intranet sites in compatibility view dans les paramètres de l'affichage de compatibilité.

Compatibility View Settings

Vous pouvez le faire apparaître en appuyant sur Alt pour obtenir le menu.

enter image description here

Editar Cette réponse s'applique également à IE9.

0 votes

Pardonnez mon ignorance, mais comment accéder à cette fiche de réglages ? J'ai vérifié les paramètres d'Internet Explorer, fait un clic droit sur la vue de compatibilité dans la barre d'adresse - rien.

2 votes

@Nick use alt pour faire apparaître la barre d'outils, c'est sous outils -> compat view settings

0 votes

Oh merci, on dirait que ça a résolu le problème. On peut se demander pourquoi ils ont fait ça.

25voto

JGilmartin Points 1974

Cela fonctionne pour moi

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

11 votes

N.B. : comme le dit Lavinski ci-dessus, "la balise meta ne fait rien pour les sites intranet".

2 votes

Pour ce que ça vaut, pour un site web hébergé (site non-intranet) qui a le format X-UA-Compatible mais qui ne déclenche toujours pas le mode document standard d'IE10 comme Page Default, j'ai découvert que si la balise meta est située sous les balises script ou si elle est trop éloignée du haut de la balise <head> dans l'arborescence DOM, IE10 pleure et définit le mode de document aux normes IE8. Donc, gardez votre IE=edge fermer la balise méta <title> tag. Ce n'est pas toujours une solution simple pour les sites Wordpress lorsque ce n'est pas codé en dur dans le fichier de modèle d'en-tête. Je ne sais pas si IE11 se soucie de l'emplacement de la balise méta, mais j'espère que cela sera utile à quelqu'un.

1 votes

Pour les copieurs et colleurs aveugles comme moi, il manque la balise de fermeture. . <meta http-equiv="X-UA-Compatible" content="IE=edge"></meta>

10voto

Jeow Li Huan Points 2133

Essayez d'ajouter la balise suivante à l'en-tête

<meta http-equiv="X-UA-Compatible" content="IE=11,IE=10,IE=9,IE=8" />

5 votes

Cela devrait être IE=Edge au lieu de

1 votes

Mais il y a un risque que les futures versions d'IE fassent quelque chose de mal et cassent votre site.

7 votes

Non, ce n'est pas un risque si vous suivez les spécifications, vous ne voyez pas les gens faire ça pour le chrome.

2voto

o.v. Points 11173

La balise meta ne fait rien pour les sites intranet et mon problème était le rendu d'IE10 en mode de compatibilité IE10. Ce qui a résolu le problème pour moi a été de prendre La réponse de @Jeow et d'utiliser cette valeur dans un en-tête http en ajoutant ce qui suit à l'élément web.config sous IIS :

<system.webServer>
  <httpProtocol> 
    <customHeaders> 
      <clear />
      <!-- <add name="X-UA-Compatible" value="IE=edge" /> not good enough -->
      <add name="X-UA-Compatible" value="IE=11,IE=10,IE=9,IE=8" /> 
    </customHeaders> 
  </httpProtocol>
</system.webServer>

Dans le cadre de l'IE, les sites intranet comprennent les sites accessibles au public qui ne sont pas dirigés vers l'extérieur. Par exemple, un employé de Stackoverflow travaillant depuis son bureau verra probablement stackoverflow.com en mode de compatibilité.

1voto

ZacNespral21 Points 35

Cela a parfaitement fonctionné pour moi quand j'ai fait ce qui suit :

Sur http://msdn.microsoft.com/en-us/library/gg699338(v=vs.85).aspx

J'ai utilisé l'exemple exact fourni dans la première boîte (j'ai ajouté les éléments manquants). </html> en bas), je l'ai ouvert dans IE10 et les normes ont été forcées, je pense que vous devez avoir du contenu réel dans le html pour qu'il force les normes, je ne suis pas sûr cependant.

Je vous suggère de remplacer votre code vide par un contenu réel (quelque chose de simple) et de voir ce que cela donne.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X