IE8 outils de développement manquant certains styles

Question

Je rencontre des problèmes avec certaines propriétés CSS dans IE8.

J'ai testé mon site dans IE7, Chrome et Firefox et ils fonctionnent bien, mais IE8 a quelques problèmes de mise en page.

J'inspecte l'option outil développeur sur ie8 et j'ai remarqué que certaines des propriétés que j'ai définies dans CSS sont ignorées par ie8. Par exemple:

#header 
{ 
position: relative; 
padding: 20px; 
height: 100px; 
background:url(header.png); 

} 

Dans cet en-tête IE8 ignoré la propriété hauteur: Si j'inspecte l'élément dans les outils de développement, il manque que la propriété et il est écrasé dans une autre ligne:

background:url;HEIGHT: 100PX 

La même chose arrive pour les flotteurs trop:

#logon 
{ 
float: left; 
text-align:right; 
width:20%; 
height: 40px; 
padding-left: 0px; 
padding-right:7px; 
border:0; 
margin:0; 
background: url(navgradient.gif); 
} 

Cela ne tient pas la valeur float:

background: url(navgradient.gif); FLOAT:left; 

Que se passe-t-il ici et comment puis-je le réparer?

Answer 1

Cela ressemble à une erreur d'analyse ou similaire. Essayez de placer des guillemets autour des noms d'images;

background: url('navgradient.gif'); 

Answer 2

Je l'ai vu se produire si la feuille de style contient filter propriétés.

Answer 3

J'ai déjà vu ça. Certains styles sont affichés sur la même ligne, m'arrive avec des lignes "filtre".

Le rendu HTML dans IE correctement, mais si vous essayez d'activer/désactiver cette ligne CSS, il affecte les deux propriétés. Donc décocher "filtre: alpha (opacité = 25); BOTTOM: 10px" dans les outils de dev désactive les règles CSS "filtre" et "bas". Donc, il semble que ce soit un bogue dans l'analyseur de dev tools, mais pas dans le moteur de rendu d'Internet Explorer. C'est fou comme ça n'est toujours pas réparé.