Problème d'affichage de z-index avec Internet Explorer

Question

Je crée un site Web et j'ai du mal à voir les choses dans IE. Tous les autres navigateurs semblent aller bien. Après quelques recherches google sur z-index, beaucoup de gens ont mentionné des bogues avec IE, principalement le correctif semble être de monter de 0 - 1000 - 2000. Après des heures de recherche, je suis toujours confus. Je suis un peu un noob quand il s'agit de ce genre de chose. Toute aide ou conseil serait très apprécié. Voici mon code:

 #bg_mask { 
      position: absolute; 
      background-color:#000000; 
      background-repeat:no-repeat; 
      background-attachment:inherit; 
      background-position:center; 
      z-index: 10; 
      visibility: hidden; 
     } 

     #frontlayer { 
      position: absolute; 
      top: 0; 
      right: 0; 
      bottom: 0; 
      left: 31.8em; 
      padding : 30px; 
      width: 20em; 
      height: 23.4em; 
      background-color: #000000; 
      visibility: visible; 
      border: 0px solid black; 
      z-index: 30; 
     } 

     #toplayer { 

      visibility: visible; 
      z-index: 2; 
     } 

     div.scroll{ 
      overflow:auto; 
      filter:alpha(opacity=0.85); 
      -moz-opacity:0.85; 
      -khtml-opacity:0.85; 
      opacity: 0.85; 
     } 

Dans la plupart des navigateurs (Chrome et Firefox) Je reçois un revêtement légèrement transparent au-dessus de mon image de fond, que je me sers du code ci-dessus. Avec IE cependant, je ne vois rien.

Note: J'ai essayé toutes les versions de IE.

Merci :)

Answer 1

Incluez le DOCTYPE approprié dans le tag html. Celui-ci pourrait fonctionner:

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"