IE bedingte Anweisung, die div anzeigt, obwohl die Bedingung besagt, dass dies nicht der Fall sein sollte

Question

Apr 29, 2014, 05:35 PM

html5boilerplate internet-explorer-9 html5 internet-explorer

IE bedingte Anweisung, die div anzeigt, obwohl die Bedingung besagt, dass dies nicht der Fall sein sollte

Ich habe ein besonderes Problem und ich hoffe, dass dies bereits jemandem begegnet ist, der dieses Problem gelöst hat, oder dass er über dieses Problem Bescheid weiß und über gute Kenntnisse verfügt, was dies verursacht.

Ich erstelle eine Site mit HTML5-Boilerplate v4.3.0 und habe die regulären bedingten Anweisungen für den IE (um den Browser zu zwingen, die neueste Rendering-Engine zu verwenden), wie hier gezeigt ...

<!--[if HTML5]><![endif]-->
<!doctype html>
<!--[if lt IE 7]>      <html class="ie ie6 lte9 lte8 lte7" lang="en"> <![endif]-->
<!--[if IE 7]>         <html class="ie ie7 lte9 lte8 lte7" lang="en"> <![endif]-->
<!--[if IE 8]>         <html class="ie ie8 lte9 lte8" lang="en"> <![endif]-->
<!--[if IE 9]>         <html class="ie ie9 lte9" lang="en"> <![endif]-->
<!--[(gte IE 9)|!(IE)]><!--> <html class="no-js" lang="en"> <!--<![endif]-->

<head>
    <!--[if !HTML5]>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <![endif]-->
    <meta charset="utf-8">  ....
    <!--- End Meta tags -->

Jetzt habe ich diese Codes basierend auf derhier verlinken, dieser Linkund auch die SO Antwort von AndrewHier.

Ich habe auch eine kleine bedingte Anweisung im Body-Tag, die auf den IE abzielt, und wenn die Version kleiner als 9 ist, zeigt sie ein Div wie hier gezeigt an ...

<body>
    <!--[if lt IE 9]>
        <p class="browsehappy">You are using an <strong>outdated</strong> browser. Please upgrade your browser to improve your experience. This site was designed to work with modern browsers like Internet Explorer 9 or above, Firefox, Chrome, etc.</p>
    <![endif]-->
   .......
</body>

Das CSS-Element für die Klasse "browsehappy" sieht folgendermaßen aus ...

.browsehappy {
margin: 0.2em 0;
background: #ccc;
color: #000;
padding: 0.2em 0;
position:fixed;
top: 0;
left: 0;
z-index: 1000;
background-color: #fff;
font-size: 14px;
width: 100%;
text-align: center;
}

Ich verwende IIS7 und / oder Apache-basiertes Xampp als Webserver. Und ich weiß, dass auf vielen Online-Hilfeseiten die beste Methode, um den IE zum Öffnen in einem bestimmten Modus zu zwingen, darin besteht, Serverkonfigurationsdateien zu verwenden. Daher habe ich die Dateien erstellt ...

<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <system.webServer>
    <httpProtocol>
      <customHeaders>
        <clear />
        <add name="X-UA-Compatible" value="IE=10" />
      </customHeaders>
    </httpProtocol>
  </system.webServer>
</configuration>

web.config für IIS7 und ...

<IfModule mod_headers.c>
    Header set X-UA-Compatible "IE=edge"
    # `mod_headers` can't match based on the content-type, however, we only
    # want to send this header for HTML pages and not for the other resources
    <FilesMatch "\.(appcache|crx|css|eot|gif|htc|ico|jpe?   g|js|m4a|m4v|manifest|mp4|oex|oga|ogg|ogv|otf|pdf|png|safariextz|svgz?|ttf|vcf|webapp|webm|webp|woff|xml|xpi)$">
        Header unset X-UA-Compatible
    </FilesMatch>
</IfModule>

Teil von .htaccess für Apache

Alles funktioniert gut, wenn ich die Server-Konfigurationsdateien in meinem Ordner mit den HTML-Dateien habe.

Ein Teil meines Problems ist jedoch, dass ich keine Kontrolle über den endgültigen Webserver habe, auf dem sich die Site befinden soll, und auch keinen Zugriff darauf. Daher muss ich eine Lösung finden, die keine Serverkonfigurationsdateien umfasst.

Jetzt scheint die bedingte Anweisung oben vor dem Head-Tag zu funktionieren. Beim Öffnen im IE9 werden der Browsermodus der IE 9-Kompatibilitätsansicht und der IE9-Standarddokumentmodus geöffnet (im Gegensatz zum IE7-Dokumentmodus und der IE9-Kompatibilität).

Die bedingte Anweisung im body-Tag funktioniert jedoch nicht richtig. Wie ich bereits erwähnt hatte, da ich keine Kontrolle über den endgültigen Webserver der Site habe, habe ich die Konfigurationsdateien aus dem Stammordner entfernt und den Meta-Tag-Ansatz verwendet, um den Browser zu erzwingen.

Das ist mein Screenshot, wenn ich in IE9 ohne die Serverkonfigurationsdateien im Stammordner öffne. Mit den Konfigurationsdateien verhält es sich korrekt.

Jetzt ist meine Frage, obwohl der Browser im IE9-Modus geöffnet ist, warum wird die Unterteilung angezeigt?

Jede Hilfe wäre sehr dankbar. Danke im Voraus. p.s: Ausgang funktioniert gut, wenn er in ie11 geöffnet wird. habe nicht in ie10 getestet.