max-width ne fonctionne pas pour IE 11

Im très nouveau designer et créer mon propre thème WordPress et il fonctionne comme prévu sur FireFox, Chrome et Opera. Le problème arrive avec InternetExplorer (im en utilisant Windows 7 avec IE 11).

Semble que internet explorer 11 ne comprends pas le max-width CSS. J'ai ce CSS:

.vi-container {
    margin: 0 auto;
    position: relative;
    width: 100%;
}

.vi-content {
    margin: 0 auto;
    max-width: 1200px;
    overflow: hidden;
}

Le code HTMl est quelque chose comme:

<div class="vi-container">
    <header class="vi-header">Header stuff</header>
    <main class="vi-content" itemtype="http://schema.org/Blog" itemprop="mainContentOfPage" itemscope="" role="main">
        <article class="post-content-wrap" itemtype="http://schema.org/BlogPosting" itemprop="blogPost" itemscope=""></article>
        <!-- more articles with contents -->
        <aside class="vi-sidebar" itemtype="http://schema.org/WPSideBar" itemscope="" role="complementary"></aside>
    </main>
</div>

Le max-width 1200px est totalement ignoré par internet explorer. Vous pouvez le voir en live le chargement de ma page dans le navigateur IE et d'autres pour comparer. Par exemple: http://www.vozidea.com/limpia-la-base-de-datos-wordpress-con-wp-sweep

Et voici un exemple JSfiddle: http://jsfiddle.net/z4s01yxz/

J'ai trouvé d'autres articles sur StackOverflow sur max-width questions sur IE, mais ne pouvait pas obtenir un correctif bymyself, c'est pourquoi im demandant de l'aide. Espérons que quelqu'un peut me donner un coup de main avec ce, merci d'avance.

Le réel problème est que dans internet explorer, la page web s'agrandit pour remplir toute la largeur, car max-width est ignoré. Vous pouvez vérifier l'image pour voir la différence: i.imgur.com/kGr8wk1.jpg

P. S: Désolé pour mon mauvais anglais.

Veuillez préciser quel est le véritable problème (ignorer n'est pas suffisant) et de fournir un exemple de code question pour le démontrer. Hors site lien n'est pas adéquate.
Fait @Paulie_D , j'ai ajouté plus d'informations, exemples de code et des écrans. Espérons tha c'est suffisant.

OriginalL'auteur Zeokat | 2015-03-01

  1. 21

    Je pense que votre problème ne vient pas de max-width mais de main élément...

    La main élément n'est pas entièrement pris en charge par IE11 (source).

    2 solutions :

    Vous êtes mon héros, merci pour la solution. Malheureusement je ne peux pas voter en place de votre solution (pas enogth réputation) mais fonctionne très bien. Merci!
    Vous bienvenue @Zeokat. Ravi de vous aider. Si cette ou de toute réponse qui a résolu votre question, vous ne pouvez pas voter, mais vous pouvez accepter, en cliquant sur la coche. Cela indique à l'ensemble de la communauté que vous avez trouvé une solution et donne une certaine réputation à la fois le répondeur et vous-même. Il n'y a aucune obligation à le faire.
    Ops! Raté la case lol. Fait 😉
    Merci! M'a aidé aussi!
    Pas de max-width n'est un problème . Il n'est pas pris en charge sur IE11

    OriginalL'auteur Guy

  2. 0

    J'ai une maladie, dans mon cas, j'ai l'image avec les parents divs dans la disposition de table. Ma condition était de faire de l'image de centre de centre de et si la grande image, puis max-width à 100%. Donc, pour en tirer le maximum de largeur de travail, j'ai le code ci-dessous:

    .cmp-logo{
  diplay:table;
  table-layout:fixed;
  width:100%;
  height:100%;
}
.td{
  display:table-cell;
  vertical-align:middle;
}
.td img{
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:260px;
  margin:0 auto;
}

    Dans la solution ci-dessus, si vous supprimez la table-layout:fixe, le max-width ne fonctionne pas dans IE11 et ci-dessous.

    OriginalL'auteur Suraj Shakya