Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Pessoal, tentei de varios jeitos, varios artigos, mas nada me resolveu o problema.
Tenho isso ó
<div class="dropdownmenu" onMouseOver="seeMenu('menucontent1', 'block')" onMouseOut="unseeMenu('menucontent1')">
<div class="content" id="menucontent1">
MEU MENUZINHO
</div>
</div>
e Isso
.dropdownmenu {
text-decoration: none;
position: relative;
background: transparent url(imagens/arrowdrop.png) center top no-repeat;
display: inline;
}
.dropdownmenu .content {
border: 3px solid #EAB693;
visibility: hidden;
position: absolute;
left: -37px !important;
top: 14px !important;
left: -50px;
top: 19px;
z-index: 10;
}Mas no IE, a flechinha fica por cima.
Alguem tem alguma idéia do que pode ser feito?
Valeu
Putz, o link não vai dar não, ta local só, e se eu atualizar la agora vai zuar tudo. Vou tentar simular em um arquivo a parte. Ja posto!
Se quiser pode postar o HTML gerado e CSS e hospeda-los. =D
Rapaz, se eu fizesse isso, ia acabar com sua tarde uauhae não são tão judas assim xD
Bom, ficou simplinho, mas retratou bem o problema.
http://added.tempsite.ws/testecss.html
No FF fica jóia, mas no IE zoa.
Passe o mouse em cima da flexinha.
Valeu a atenção ;)
Estranho... Estou sem tempo agora para analisar em detalhes, mas tente usar display:none&block ao invés de visibilty.
Ola Thiago, tranquilo.
Então, ja tentei tambem, tentei até outros tipos, como table e tal.
Nada =(
Andei lendo que isso é um bug do IE mesmo, não controlar z-index de position:relative. Mas tem como contornar colocando outros elementos como relative, mas não dei conta não =/
Estou sem Internet Explorer aqui, mas tenta colocar assim nessa última td » <td style="z-index: 1;">.
Mesma coisa =(
Quer que eu tire ou deixe?
Cara, tem uns lances no IE6 que não dá pra entender. Acho que nele, pra funcionar o z-index, o elemento pai e os filhos que você quer tem que ter o z-index setados.
Tenta aí e me diz o que deu. To baixando o IETester (to sem IE tbm! :blink: )
To na pós agora =/ (suca)
Mas mesmo não sendo IE 6 (ja chegamos a conclusão em nem homologar mais IE 6) vou testar isso, o duro é que tem pai pra caramba, será que se eu jogar um
.content * { z-index: 1; }
firma?
Consegui.
<html><head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<style>
.dropdownmenu {
text-decoration: none;
background: transparent url(arrowdrop.png) center top no-repeat;
display: inline;
}
.dropdownmenu .content {
border: 3px solid #EAB693;
visibility: hidden;
position: absolute;
margin: 5px -25px;
}
</style>
<script>
function seeMenu(id, mode) {
document.getElementById(id).style.display = mode;
document.getElementById(id).style.visibility= 'visible';
}
function unseeMenu(id) {
document.getElementById(id).style.display = 'none';
document.getElementById(id).style.visibility= 'visible';
}
</script>
</head><body>
<table border="1" width="999">
<tbody><tr>
<td>linha 1</td>
<td>linha 1</td>
<td>linha 1</td>
<td>
<img src="testecss_arquivos/editar.gif" title="Editar" border="0">
<div class="dropdownmenu" onmouseover="seeMenu('menucontent1', 'block')" onmouseout="unseeMenu('menucontent1')">
<div style="background-color: rgb(255, 255, 255); display: none;" class="content" id="menucontent1">
Menu 1 <br> Menu 2 <br> Menu 3
</div>
</div>
</td>
</tr>
<tr>
<td>linha 2</td>
<td>linha 2</td>
<td>linha 2</td>
<td style="z-index: 1;">
<img src="testecss_arquivos/editar.gif" title="Editar" border="0">
<div class="dropdownmenu" onmouseover="seeMenu('menucontent2', 'block')" onmouseout="unseeMenu('menucontent2')">
<div style="background-color: rgb(255, 255, 255); display: none; z-index: 10" class="content" id="menucontent2">
Menu 1 <br> Menu 2 <br> Menu 3
</div>
</div>
</td>
</tr>
<tr>
<td>linha 3</td>
<td>linha 3</td>
<td>linha 3</td>
<td style="z-index: 1;">
<img src="testecss_arquivos/editar.gif" title="Editar" border="0">
<div class="dropdownmenu" onmouseover="seeMenu('menucontent3', 'block')" onmouseout="unseeMenu('menucontent3')">
<div style="background-color: rgb(255, 255, 255); display: none; visibility: visible;" class="content" id="menucontent3">
Menu 1 <br> Menu 2 <br> Menu 3
</div>
</div>
</td>
</tr>
<tr>
<td>linha 4</td>
<td>linha 4</td>
<td>linha 4</td>
<td style="z-index: 1;">
<img src="testecss_arquivos/editar.gif" title="Editar" border="0">
<div class="dropdownmenu" onmouseover="seeMenu('menucontent4', 'block')" onmouseout="unseeMenu('menucontent4')">
<div style="background-color: rgb(255, 255, 255); display: none; visibility: visible;" class="content" id="menucontent4">
Menu 1 <br> Menu 2 <br> Menu 3
</div>
</div>
</td>
</tr>
<tr>
<td>linha 5</td>
<td>linha 5</td>
<td>linha 5</td>
<td style="z-index: 1;">
<img src="testecss_arquivos/editar.gif" title="Editar" border="0">
<div class="dropdownmenu" onmouseover="seeMenu('menucontent5', 'block')" onmouseout="unseeMenu('menucontent5')">
<div style="background-color: rgb(255, 255, 255);" class="content" id="menucontent5">
Menu 1 <br> Menu 2 <br> Menu 3
</div>
</div>
</td>
</tr>
</tbody></table>
</body></html>
Estranho que nunca havia tido problemas com z-index no Internet Explorer 6. :mellow:Poxa, então, o problema era no IE 7.
Copiei seu código la, e continua ainda =/
não vi mudança no seu código, o que você fez la?
Aqui funcionou.
http://forum.imasters.com.br/public/style_emoticons/default/seta.gif http://thiagotestes.site90.com/iMasters/testecss.html
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
aehuaheuahe alguma coisa tem ai no seu de diferente, tem como você deixar até a noite pra quando eu chegar em casa eu dar uma olhada?
auehuahe massa, era isso mesmo que eu queria xD
Deixo no ar sim. No problems. =)
Thiago, sinto muito, mas não consigo fazer o que você fez.
Para mim você só colocou o z-index: 1 no TD e o z-index: 10 no div. Porem repare que na primeira e na segunda linha voce não fez isso, e mesmo assim não aparece. Não entendi de verdade, sabe me dizer o que voce fez?
Mas está funcionando? Agora estou sem poder usar Internet Explorer. =/
Acho que do jeito que fiz, se deixar sem nenhum z-index funciona. ;)
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Então Thiago, o seu funciona sim, ta certinho, mas eu não sei o que você fez, esse é o detalhe. Aparentemente o que voce fez foi colocar os z-index em cada TD e nos DIVs, se eu tirar isso volta a ser o que era o meu. Mas eu colocando isso no meu, tb não funciona. Gostaria de saber se você fez algo a mais do que colocar estes z-index, que talvez tenha passado perante meus olho.
Valeua ajuda, de verdade xD
Veja o que eu mudei no CSS.
Você pode tirar esse z-index:10
<div style="background-color: rgb(255, 255, 255); display: none; z-index: 10" class="content" id="menucontent2">
Menu 1 <br> Menu 2 <br> Menu 3
</div>
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gifahhahae beleza, chegamos a um acordo haeuhae
ó
http://added.tempsite.ws/testecss.html
Mudei exatamente o que voce fez. da uma olhada ai quando tiver com o IE. Ainda ta zuado =/
Pior que isso me enrrolou todo, por que agora nem consigo olhar o código mais xD
Poste o link para melhor ajuda-lo. ;)