-Bien todo comenzo...
Bueno dicho la tontería al lío.
Mi problema viene a la hora de utilizar Z-index con div anidados, donde iexplorer es el protagonista malo (Solo lo he probado en el iexplorer 6 ya que no tengo el nuevo)
Estoy haciendo una pagina donde anido un div (container )que lleva un fondo con repite-x y dentro de el otro div (cabecera) que lleva una imagen de cabecera no-repite, y dentro de este div otro mas (container2) que hace de contenedor para las columnas que llevara la pagina web.
Bien pues el problema viene al intentar ordenar los div de manera que quede en vision :
1º cabecera
2º container
3º container2
osea asi:
Bien pues en firefox bien:
pero en iexplorer mal: no:
Código :
<style type="text/css"> html,body{ height:100%; background-color:#9999FF } #container{ background:url(cabeceraRepite.GIF) repeat-x; height:100%; position:relative; z-index:0; } #cabecera{ background:url(cabecera.GIF) no-repeat; height:100%; width:500px; position:relative; margin:auto; z-index:1; } #container2{ height:100%; position:relative; z-index:-2; } #columnaIzquierda{ background-color:#996666; height:100%; width:200px; position:relative; float:left; z-index:-3; } #columnaCentral{ background-color:#99CC66; height:100%; width:300px; position:relative; float:left; z-index:-4; } </style>
Código :
<body> <div id="container"> <div id="cabecera"> <div id="container2"> <div id="columnaIzquierda"></div> <div id="columnaCentral"></div> </div> </div> </div> </body>
Gracias por adelantado