4 replies to this topic

[Lucas Weizenmann]

http://www.globoinfo...novo/index4.php

No IE, a figura de fundo_cima fica sobre o menu. Já vi que dá pra resolver isso com Javascript e tals, mas também li que o IE considera que o z-index de maior numero fica na frente, como deve ser claro. em duas divs nessa pagina o z-index funcionou. só não entendo porque dessa vez não está funcionando.

.fundo_cima
{
position: absolute;
top: 0%;
bottom: 0px;
background-image: url("fundo_cima.jpg");
width: 100%;
height: 120px;
z-index: 1;
}

.fundo_embaixo
{
position: absolute;
top: 143%;
bottom: 0px;
background-image: url("fundo_embaixo.jpg");
width: 100%;
height: 89px;
z-index: 2;
}

.base
{
width: 960px;
height: 250px;
position: absolute;
float:left;
top: 110%;
bottom: 0;
margin-left: 20px;
z-index: 3;
}

.rodape
{
position:fixed;
bottom: 0px;
width: 384px;
height: 51px;
margin-left: 616px;
color: #fff;
background-image: url("rodape.png");
z-index: 4;
}


.sombra,.menu{
position: relative;
bottom: 3px;
right: 3px;
z-index: 5;
}
   
.menu
{
float:left;
background-color:#0D74A6;
height: 40px;
width: 500px;
text-align:center;
z-index: 6;
}

Menu com z-index 6, o maior, deve ficar na frente de todos. certo?
Safari, Google Chrome, Firefox, fica legal.
No IE não.

Alguma mudança no CSS?

po
eu so 'Turista'.
hmm.. vo te que frequenta mais né.. senao perco credito aqui..
rs..

[Édipo Costa Rebouças]

para usar o z-index vc deve setar a propriedade position com um valor diferente do padrão(static), por padrão position é sempre static, então no caso, use position: relative;

[Lucas Weizenmann]

okay..

mas veja só...
mudei a posição da div e coloquei ela dentro da div topo que tem também o menu.
e ali dentro..funcionou..hehe

flow!

[Édipo Costa Rebouças]

então lucas, é que o z-index, pode-se dizer que é "relativo ao seu pai", pode exemplo:

vc tem:

<div class="topo">
<div class="oi">
</div>
<div class="testeZ"> <!-- --> </div>

se você define que topo tem z-index: 0; testeZ tem z-index: 1 e oi tem z-index: 2,

E vc colocu o testeZ sobre o topo, o testeZ vai ficar encima de tudo, mesmo oi tendo z-index: 2, pois esse z-index: só vai funcionar dentro de topo.

[Lucas Weizenmann]

entendido Édipo..
obrigado pela explicação!