[Resolvido] Z-Index no internet Explorer 6

[ulissesalmeida 0]

Olá pessoal, meu código Css funciona muito bem no internet Explorer 7, Firefox e afim... porém no IE6 tenho um grande problema.

 

A idéia é simples, quando o usuário clica no botão surge uma tela cinza que cobre toda a tela com efeito alpha e por cima dela uma outra div com um formulário. Alguém poderia me ajudar a corrigir meu código para funcionar no IE6, já procurei no Google mas não achei nenhuma explicação clara de como funciona.

 

Meu código:

Observação: O display está como none, porque depois eu altero por javascript.

#telaCinzaQueCobreTodaTela
{
	background-color:#333333;
	height:100%;
	width:100%;
	z-index:98;
	position:fixed;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom:0px;
	opacity: .8;
	filter: alpha(Opacity=80);
	khtml-opacity: .8;
	display:none; 
}

.formularioQueFcaPorCimaDaTelaCinza
{
	background-image: url(../img/linha.gif);
	background-position: left top;
	background-repeat: no-repeat;
	background-color:transparent;
	height:20%;
	width:40%;
	z-index:99;
	position:fixed;
	top: 40%;
	left: 30%;
	right: 30%;
	bottom: 40%;
	display:none;
	
}

Obrigado!

[Aprendiz CSS 3]

para o z-index funcionar você deve configurar a position sendo como absolute ou relative.

 

sem isso não funciona, com outra propriedade de position fixed ou static ele não é alterado.

 

abraço

[ulissesalmeida 0]

Ok, esse posicionamento ajudou aparecer minhas Divs. Porém na div da Tela Cinza deve ocupar sempre 100% da página, não importa o monitor. Entretando o width: 100% e height:100% não funciona no IE6. Alguém tem alguma solução?

[Aprendiz CSS 3]

utilize doctype strict

 

html, body {
	height: 100%;
}

#div_que_quer{
	 height:100%;
	 min-height: 100%;
}

abraço

[ulissesalmeida 0]

Opa, vlw!

[ulissesalmeida 0]

Obrigado pela ajuda ai galera, mas preferi fazer dois visuais diferentes. Um para navegadores novos e outro pra navegadores antigos. Acho que essa é a melhor saída mesmo.

 

Abraços!