Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

foreverjuba

Submenus não aparecem no Internet explorer.

Recommended Posts

Ola pessoal o meu menu horizontal funciona perfeitamente no firefox, mas quando chega no internet explorer os submenus ficam

atras da div que fica abaixo. Como faço para os submenus apareçam na frente da div meio(ver código html)?

 

CSS

/*Menu*/
#nav, 
#nav ul {padding:0 0 5px 0; margin:0; list-style:none; font-size:14px; font-weight: 600; font-family:"Comic Sans", "Comic Sans MS", cursive; border:1px solid #000; border-color:#eca #b97 #a86 #edb; border-width:1px 2px 2px 1px; background:#495C67; position:relative; z-index:200;}
#nav {height:25px; padding:0;}

#nav li {float:left;}
#nav li li {float:none; background:#fff;}
/* a hack for IE5.x and IE6 */
* html #nav li li {float:left;}

#nav li a {display:block; float:left; color:#fff; margin:0 25px 0 10px; height:25px; line-height:25px; text-decoration:none; white-space:nowrap;}
#nav li li a {height:20px; line-height:20px; float:none;}

#nav li:hover {position:relative; z-index:300;}
#nav li:hover ul {left:0; top:22px;}
/* another hack for IE5.5 and IE6 */
* html #nav li:hover ul {left:10px;}

#nav ul {position:absolute; left:-9999px; top:-9999px;}
/* yet another hack for IE5.x and IE6 */
* html #nav ul {width:1px;}

/* it could have been this simple if all browsers understood */
/* show next level */
#nav li:hover li:hover > ul {left:-15px; margin-left:100%; top:-1px;}
/* keep further levels hidden */
#nav li:hover > ul ul {position:absolute; left:-9999px; top:-9999px; width:auto;}
/* show path followed */
#nav li:hover > a {text-decoration:underline; color:#b75;}


/* but IE5.x and IE6 need this lot to style the flyouts and path followed */
/* show next level */
#nav li:hover li:hover ul,
#nav li:hover li:hover li:hover ul,
#nav li:hover li:hover li:hover li:hover ul,
#nav li:hover li:hover li:hover li:hover li:hover ul
{left:-15px; margin-left:100%; top:-1px;}

/* keep further levels hidden */
#nav li:hover ul ul,
#nav li:hover li:hover ul ul,
#nav li:hover li:hover li:hover ul ul,
#nav li:hover li:hover li:hover li:hover ul ul
{position:absolute; left:-9999px; top:-9999px;}

/* show path followed */
#nav li:hover a,
#nav li:hover li:hover a,
#nav li:hover li:hover li:hover a,
#nav li:hover li:hover li:hover li:hover a,
#nav li:hover li:hover li:hover li:hover li:hover a,
#nav li:hover li:hover li:hover li:hover li:hover li:hover a
{text-decoration:underline; color:#b75;}

/* hide futher possible paths */
#nav li:hover li a,
#nav li:hover li:hover li a,
#nav li:hover li:hover li:hover li a,
#nav li:hover li:hover li:hover li:hover li a,
#nav li:hover li:hover li:hover li:hover li:hover li a
{text-decoration:none; color:#888;}

HTML

<div id="todo">
	<div id="topo">
		<ul id="nav">
			<li><a href="index_relatorios.php?pg=1">Principal</a></li>
			<li><a href="#nogo">Relatórios<!--[if IE 7]><!--></a><!--<![endif]-->
				<!--[if lte IE 6]><table><tr><td><![endif]-->
				<ul>
					<li><a href="index_relatorios.php?pg=2">Ata Rendimento Aluno</a></li>
					<li><a href="index_relatorios.php?pg=4">Rendimento Final</a></li>
					<li><a href="index_relatorios.php?pg=3">Rendimento Geral Por Série</a></li>
					<li><a href="index_relatorios.php?pg=5">Quadro Demonstrativo Alunos</a></li>
					<li><a href="index_relatorios.php?pg=6">Quadro Demonstrativo Idade</a></li>
				</ul>
				<!--[if lte IE 6]></td></tr></table></a><![endif]-->
			</li>
			<li><a href="index.php">Voltar</a></li>		
		</ul>
	</div>

	<div id="meio">
		<?php include("carregapagina_relatorios.php"); 	pg_close($con);?>
		<div style="clear: both;"></div>
	</div>

	<div id="rodape">
		<div id="rodape_esquerdo">
			<img src="relatorios_socorro/img/infonet.gif" >
		</div>
		<div id="rodape_direita">
			Aracaju-SE, CEP 49015-030<br/>
			<a href="mailto:alexandre@infonet.com.br">alexandre@infonet.com.br</a>
		</div>
	</div>
</div>

Compartilhar este post


Link para o post
Compartilhar em outros sites

lol

 

sinceramente, não entendi nada do seu código :blink:

 

pra que tudo isso?

 

 

#nav li ul{display:none;}
#nav li:hover ul{display:block;}

só isso aqui já deixa o submenu oculto e quando passa o mouse ele aparece :)

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.